JavaScript метод document.open()
JavaScript DocumentОпределение и применение
JavaScript метод .open() объекта document позволяет открыть поток для записи документа (данные могут быть переданы с помощью методов write() или writeln() объекта document).
Если документ существует, то этот метод очистит его содержимое (автоматический вызов метода .open() объекта document происходит когда метод write(), или writeln() вызываются после загрузки страницы, но это не определено в спецификации W3C).
Не путайте этот метод с одноименным методом объекта window, который позволяет открыть новое окно браузера, оставив текущий документ в том же состоянии. Для того, чтобы завершить запись в документ (закрыть поток открытый с помощью метода .open() объекта document) необходимо воспользоваться методом close() объекта document.
Поддержка браузерами
Метод | Chrome | Firefox | Opera | Safari | IExplorer | Edge |
---|---|---|---|---|---|---|
document.open() | Да | Да | Да | Да | Да | Да |
JavaScript синтаксис:
document.open() document.open( MIMEtype, replace ) MIMEtype, replace - String
Спецификация
Document Object Model (DOM) Level 1Значения параметров
Параметр | Описание |
---|---|
MIMEtype | Тип документа, в котором открывается поток для записи документа. Значение по умолчанию - "text/html" (новый документ будет являться HTML документом, если аргумент отсутствует, или имеет значение "text/html", иначе будет создан простой текстовый документ). Необязательный параметр. |
replace | Cтрока, указывающая, должен ли новый записываемый документ заменять текущий документ в списке истории. По умолчанию если не указана строка "replace" создаваемый документ не заменяет текущий документ в списке истории (вы можете вернуться на эту страницу, нажав кнопку браузера "назад"). |
Пример использования
<!DOCTYPE html> <html> <head> <title>Пример создания документа в новом окне</title> </head> <body> <button onclick = "myFunc()">Нажми меня</button> <!-- добавляем атрибут событий onclick --> <script> function myFunc() { let newWindow = window.open(), // метод позволяет открыть новое окно браузера newWindowDocument = newWindow.document; // ссылаемся на объект document в новом открытом окне // открываем поток для записи документа newWindowDocument.open("text/html", "replace"); // используем метод write newWindowDocument.write("<html><head><title>My document</title></head><body>"); newWindowDocument.write("<h1>Hello</h1>"); newWindowDocument.write("<pre>"); newWindowDocument.write("1"); newWindowDocument.write("2"); newWindowDocument.write("3<br>"); // используем метод writeln newWindowDocument.writeln("1"); newWindowDocument.writeln("2"); newWindowDocument.writeln("3"); // используем метод write newWindowDocument.write("</pre>"); newWindowDocument.write("</body></html>"); // закрываем поток newWindowDocument.close(); } </script> </body> </html>
В этом примере с использованием атрибута событий onclick при нажатии на кнопку (HTML элемент <button>) вызываем функцию myFunc(), которая с использованием JavaScript метода .open() объекта window открывает новое окно браузера, а с помощью метода .open() объекта document открывает поток для записи этого документа. В этот документ с помощью методов write() и writeln() записываем в поток необходимые строки текста.
Основное отличие методов write() и writeln() заключается в том, что метод writeln() дополнительно добавляет символ новой строки. Это полезно, например, при работе с HTML элементом <pre>, который сохраняет как пробелы, так и разрывы строк.
После того как мы записали в документ необходимое текстовое содержимое, мы с помощью метода close() объекта document закрываем поток открытый с помощью метода .open() объекта document.
Обратите внимание, что мы дополнительно передали в метод .open() объекта document два аргумента, первый определяет тип документа ("text/html" - HTML документ по умолчанию), а второй аргумент соответствует значению "replace", которое указывает, что пользователь, если перейдет в открытом окне на новую страницу не сможет обратно на неё вернуться (кнопка браузера "назад" будет не активна).
Результат нашего примера:
JavaScript Document