- HTML DOM Document write()
- Hello World!
- Description
- Warning
- Note
- See Also:
- Syntax
- Parameters
- Return Value
- More Examples
- Hello World
- New Window
- The Difference Between write() and writeln()
- Example
- Note
- Examples
- Browser Support
- COLOR PICKER
- Report Error
- Thank You For Helping Us!
- Всё только о JavaScript
- Как работает document.write
- Вывод скриптов
- Примеры ошибочного использования
- Область применения
- Генерация нового документа
- Вывод динамического содержимого на этапе загрузки
- Информеры для внешних сайтов
- Удивительная история document.write
- Существует ли нормальный повод применять document.write ?
- Можно ли вызвать document.write внутри document.write ?
- Типа, бесконечно много раз?
- Серьезно? Двадцать?
- Они что, независимо друг от друга до этого додумались?
- Можно ли сломать браузер еще быстрее?
- Какие еще глупости можно натворить с document.write ?
- Что-нибудь еще?
- Если метод бесполезен, зачем я про него вообще читаю?
HTML DOM Document write()
Write some HTML elements directly to the HTML output:
document.write(«
Hello World!
Have a nice day!
«);
Using document.write() after a document is loaded, deletes all existing HTML:
Description
The write() method writes directly to an open (HTML) document stream.
Warning
The write() method deletes all existing HTML when used on a loaded document.
The write() method cannot be used in XHTML or XML.
Note
The write() method is most often used to write to output streams opened by the the open() method.
See Also:
Syntax
Parameters
Parameter | Description |
exp1. | Optional. The output stream. Multiple arguments are appended to the document in order of occurrence. |
Return Value
More Examples
Write a date object directly to the HTML ouput:
Open an output stream, add some HTML, then close the output stream:
document.open();
document.write(«
Hello World
«);
document.close();
Open a new window and write some HTML into it:
const myWindow = window.open();
myWindow.document.write(«
New Window
«);
myWindow.document.write(«
Hello World!
«);
The Difference Between write() and writeln()
The writeln( ) method is only useful when writing to text documents (type=».txt»).
Example
document.write(«Hello World!»);
document.write(«Have a nice day!»);
document.write(«
«);
document.writeln(«Hello World!»);
document.writeln(«Have a nice day!»);
Note
It makes no sense to use writeln() in HTML.
It is only useful when writing to text documents (type=».txt»).
Newline characters are ignored in HTML.
If you want new lines in HTML, you must use paragraphs or
:
Examples
document.write(«
Hello World!
«);
document.write(«
Have a nice day!
«);
Browser Support
document.write is supported in all browsers:
Chrome | Edge | Firefox | Safari | Opera | IE |
Yes | Yes | Yes | Yes | Yes | Yes |
COLOR PICKER
Report Error
If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:
Thank You For Helping Us!
Your message has been sent to W3Schools.
Top Tutorials
Top References
Top Examples
Get Certified
W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.
Всё только о JavaScript
document.write(arg1[, arg2[, arg3[, . ]]]) — метод, выводящий на страницу переданные ему аргументы. Аргументов может быть любое количество, и они могут быть любых типов, при выводе они преобразуются в строки.
Также существует функция document.writeln , которая аналогична document.write , но добавляет в конце своего вывода перевод строки.
Как работает document.write
document.write выводит свои аргументы после того тега script , в котором он был вызван. К примеру код
Обратите внимание: не после того тега script , в котором записано выражение document.write , а после того, в котором оно было вызвано. Следующий код
document.write работает только на этапе загрузки страницы, его нельзя вызывать в ответ на какое-нибудь событие. Если document.write вызвать после того, как страница загрузилась, результат во всех браузерах будет примерно одинаков — пустая страница и, возможно, тот текст, который был выведен последним document.write . Поэтому даже не пытайтесь использовать его в ответ на какие-то действия пользователя, только на этапе загрузки страницы.
Вывод скриптов
Как и любое другое содержимое, document.write может выводить и скрипты, которые тоже в свою очередь могут содержать document.write . Но нужно помнить: внедрённые в HTML скрипты не могут содержать внутри себя в явном виде строку . Нужно или разорвать этот тег на части ‘‘ , или заменить какой-нибудь символ на escape-последовательность . В скриптах, содержащихся во внешних файлах, такие манипуляции не требуются.
Если вложенные скрипты тоже, в свою очередь, содержат document.write , то всё будет выведено последовательно.
Результат на странице будет
Создаём первый скрипт.
Первый скрипт
Создаём второй скрипт.
Второй скрипт
Закончили.
Однако такая последовательность сохраняется до тех пор, пока мы не решим подключить внешние скрипты, выводящие текст на страницу. Создадим, например, файл test1.js с содержимым
document.write('Содержимое test1.js
');
И файл test2.js с содержимым
document.write('Содержимое test2.js
');
Тогда результат работы скриптов на следующей странице будет различаться в различных браузерах.
В Firefox и Safari выведется ожидаемое
Подключаем test1.js
Содержимое test1.js
Подключаем test2.js
Содержимое test2.js
Закончили подключать
А вот Opera, Chrome и Internet Explorer поведут себя в какой-то мере логично, но не последовательно.
Подключаем test1.js
Подключаем test2.js
Закончили подключать
Содержимое test1.js
Содержимое test2.js
Другими словами, если Firefox и Safari обрабатывают появляющиеся скрипты последовательно, независимо от того, внешние они или внедрёные, то Opera, Chrome и IE выполняют внешние созданные динамически скрипты только после того, как выполнится текущий блок .
Поэтому, если вы кроссбраузерно хотите динамически подключить внешний скрипт и выполнить какие-нибудь действия после того, как он отработает, то эти действия необходимо также выносить во внешний файл.
Разный результат в разных браузерах:
Одинаковый результат во всех браузерах:
document.write('Закончили подключать
');
Примеры ошибочного использования
Как было сказано выше, document.write выводит текст только во время загрузки страницы. В этом и заключается основная ошибка многих начинающих JavaScript-программистов — они пытаются использовать document.write в ответ на пользовательские события, например, onclick , в результате чего получают пустую страницу.
Запомните, если вы хотите изменить содержимое блока, то нужно найти этот блок в DOM-дереве, например, по его идентификатору, и изменить у него свойство innerHTML .
document.getElementById('content').innerHTML = 'Новое содержимое';
Область применения
Области применения у document.write две: создать новый документ с нуля и сгенерировать динамический контент в том самом месте, где находится родительский элемент script . Всё остальное вариации этих двух случаев.
Генерация нового документа
Если нужно открыть новое окно или создать новый фрейм, содержимое которых не загружается с какого-то урла, а должно генерироваться динамически, то самый простой способ — это написать содержимое нового документа с помощью document.write .
var w = window.open(); w.document.open(); // Открываем документ для записи w.document.writeln(''); w.document.write(' Это динамическое окно.'); w.document.close(); // Заканчиваем формирование документа
Обратите внимание на вызов метода close , пока он не вызван, браузер считает, что документ ещё не до конца загружен, и не убирает индикатор загрузки.
Вывод динамического содержимого на этапе загрузки
Под таким сложным заголовком скрывается простая вещь. Предположим мы хотим выводить на странице текущий день недели. Тогда в то место, где он должен находиться, нужно вставить следующий код.
Сегодня .
Несмотря на предрассудки по отношению к document.write , это самый простой способ, в отличие от DOM-методов, и в подобных случаях он более чем уместен.
Информеры для внешних сайтов
Ещё одна область применения для document.write — предоставление кодов сторонним сайтам для вывода различных виджетов, информеров, банеров, контекстных объявлений и прочих подобных вещей. Смысл здесь в том, чтобы предоставить неискушённому пользователю код, который он сможет без лишних движений поставить в то место, где должен появляться соответствующий блок. Тогда пользователю выдаётся простой код в виде тега script и, возможно, инициализации каких-то параметров.
А в этот скрипт уже выдаётся код, который создаёт нужный html-код.
Удивительная история document.write
Метод document.write — один из самых странных методов. Он вставляет HTML-код на страницу сразу после себя. Точнее говоря, сразу после тега
Можно вставить строку, которая явно сломает остальную страницу:
Или можно поиграть в русскую рулетку:
if (Math.random() > 0.9) document.write('Читайте также: Чтение из сокета java