Когда запускается window.onload? - программирование

Я немного смущен, когда запускается событие window.onload. Например: у меня есть страница с большим количеством внешних js файлов и даже по требованию загрузки script (динамическое создание тега). Весь этот код находится на странице (т.е. Он не срабатывает при щелчке или smth, он должен выполняться при загрузке). Теперь скажем, что у меня есть window.onload = somefunction() в последнем javascript по требованию. Возможно ли, что window.onload будет срабатывать до того, как все скрипты будут загружены?

Ответы

Ответ 1

window.onload (a.k.a body.onload) запускается после основного HTML, все CSS, все изображения и все другие ресурсы были загружены и отображены. Поэтому, если ваши снимки затормаживают, это может занять некоторое время.

Если вам просто нужен HTML (DOM), вы можете использовать jQuery $(document).ready() - он будет срабатывать при анализе HTML, но до того, как браузер завершит загрузку всех внешних ресурсов (изображения и таблицы стилей, которые появляются после вашего элемента script в HTML).

Скрипты, встроенные в страницу, выполняются, когда браузер анализирует </script> каждого. Итак, чтобы выполнить script перед любым другим script, добавьте тег <script> в заголовок сразу после <head>.

Это означает, что вы можете "эмулировать" window.onload, добавив тег <script> в качестве последнего элемента <body>.

Ответ 2

~~Нет. window.onload() вызывается, когда все ресурсы (документ, объекты, изображения, css и т.д.) завершают рендеринг.~~

Неправильный вопрос. Да, вполне возможно, что событие window.onload будет запущено до завершения загрузки динамически добавленного script. Сценарии, добавленные с помощью DOM (document.createElement()) загружаются асинхронно и не подчиняются обычному правилу, что window.onload() ожидает, что все ресурсы закончат загрузку в первую очередь.

Я установил для вас тестовый набор, http://jsfiddle.net/ywSMW/. Этот script динамически добавляет jQuery script в DOM и записывает значение $ на консоль во время обработчика onload. Затем он записывает значение снова через секунду. Даже при кэшировании script первая запись в консоль возвращает undefined, что означает, что onload даже активировался до того, как jQuery script был загружен и проанализирован.

Протестировано в IE и Chrome.

Re: комментарии, если вы хотите проверить, запущено ли событие onload, вы можете установить значение глобальной переменной внутри обработчика onload:

var windowHasLoaded = false;

window.onload = function () {
    windowHasLoaded = true;
}

function doSomethingWhenWindowHasLoaded() {
    if (!windowHasLoaded) {
        // onload event hasn't fired yet, wait 100ms and check again 
        window.setTimeout(doSomethingWhenWindowHasLoaded, 100);
    } else {
        // onload event has already fired, so we can continue
    }        
}