Можно ли запустить javascript перед загрузкой всей страницы?

Я хочу запустить немного javascript перед загрузкой всей страницы. Это возможно? Или код запускается на </html>?Можно ли запустить javascript перед загрузкой всей страницы?

источник

2010-05-27 picknick

Возможный дубликат [Как я могу выполнить функцию Javascript до загрузки страницы?] (Http://stackoverflow.com/questions/885909/how-can-i-execute-javascript-function-before-page-load) – miku

Я не думаю, что это дубликат - это больше вопрос о связи между сервером и клиентом. – scunliffe

135

Не только может вас, но вы должны приложить особые усилия не, если вы не хотите. :-)

Когда браузер разыгрывает тег script при разборе HTML, он прекращает разбор и передает интерпретатору Javascript, который запускает скрипт. Только когда скрипт завершен, браузер возобновляет разбор страницы (потому что сценарий может сделать document.write вызовы для разметки вывода, которые должен обрабатывать анализатор). Это поведение по умолчанию; есть атрибуты тегов script, которые могут помешать этому (defer and async).

Так считает это:

<!DOCTYPE HTML> 
<html><head><!-- yada yada yada --></head> 
<body> 
<p>Line 1</p> 
<script type='text/javascript'> 
    alert("Stop that parsing!"); 
</script> 
<p>Line two</p> 
</body> 
</html>

Если вы загрузите эту страницу, вы увидите пункт «Линия 1» в то время как предупреждение показывает, и «линия 2» абзац появляется после того, как это делается.

Где он немного запутан, взаимодействует с DOM, поскольку DOM создается парсером, поскольку он выполняет свою задачу, и ваш скрипт может работать до того, как DOM полностью готов к манипулированию. В общем случае, если вы только обращаетесь к элементам, которые предшествуют тегу script в файле, вы в порядке, но чтобы быть в безопасности, лучше всего отложить любые взаимодействия с DOM до тех пор, пока DOM не будет полностью построена.

Но по большей части вы можете с радостью получить доступ к более ранним элементам. Рассмотрим:

<!DOCTYPE HTML> 
<html><head><!-- yada yada yada --></head> 
<body> 
<p id='p1'>Line 1</p> 
<script type='text/javascript'> 
    document.write("<p>p1 is null? " + (document.getElementById('p1') == null ? "yes" : "no") + "</p>"); 
    document.write("<p>p2 is null? " + (document.getElementById('p2') == null ? "yes" : "no") + "</p>"); 
</script> 
<p id='p2'>Line two</p> 
</body> 
</html>

Выход вы видите:

Line 1 
p1 is null? false 
p2 is null? true 
Line 2

... потому что p1 существует в том, когда запускается скрипт, но p2 не делает.

~~У меня нет ссылки под рукой, но~~In this message, разработчики библиотеки Google Closure говорят, что они не видят большую ценность для «готовых» событий в стиле, что Prototype, JQuery, ExtJS, Dojo , и большинство других обеспечивают, потому что, если вы поместите скрипт после элементов, с которыми хотите взаимодействовать, вы в порядке; в соответствии с YUI's recommendation, вы просто положили свои скрипты прямо перед закрытием тега </html> (так как в конце концов вы должны поставить где-то, и там они не задерживают отображение вашей страницы). Теперь, лично, я вижу некоторую ценность в этих событиях, хотя я думаю, что они чрезмерно используются, но я хочу сказать, что вы можете начать взаимодействие с вещами очень рано.

источник

2010-05-27 10:16:43

Отличный ответ. Спасибо. – picknick

Или вы можете использовать делегирование событий и настроить обработчики до того, как страница загрузится, чтобы получить более гибкий интерфейс. Вот хорошая статья об этом: [Не позволяйте jQuery $ (document) .ready() замедлять работу) (http://encosia.com/2010/08/18/dont-let-jquerys-document-ready -slow-you-down /) – Tgr

Возможно ли с javascript заменить значение (например, изменить «Линия 1» на «привет мир»), прежде чем браузер отобразит p1? Я хочу сказать, что я не хочу, чтобы экран мерцал, если я заменил значение p1. Я хочу заменить значение/текст p1 на javascript, прежде чем пользователь сможет увидеть p1 (и p2 и другие элементы). Это возможно? – n00b

-4

Я думаю, вы получите сообщение об ошибке, если попытаетесь обратиться к элементу управления, находящемуся в блоке, перед загрузкой всей страницы.

источник

2010-05-27 10:10:26 Raj

Вы можете запустить javascript-код в любое время. AFAIK выполняется в тот момент, когда браузер достигает < скрипта >, где он находится. Но вы не можете получить доступ к тем элементам, которые еще не загружены.

Поэтому, если вам нужен доступ к элементам, вы должны подождать, пока загрузится DOM (это не означает, что загружена вся страница, включая изображения и прочее.Это только структура документа, загружаемая намного раньше, поэтому вы обычно не заметите задержку), используя событие DOMContentLoaded или такие функции, как $.ready в jQuery.

источник

2010-05-27 10:17:44 Marian

Событие DOMContentLoaded будет срабатывать, как только иерархия DOM будет полностью построена, событие загрузки будет делать это, когда все изображения и суб- кадры закончили загрузку. – BeauCielBleu

Ты абсолютно прав, я исправил это. Мерси :) – Marian

Можно ли запустить javascript перед загрузкой всей страницы?

ответ

Смежные вопросы