Какие внешние ресурсы загружаются при возникновении события window.onload и каков порядок загрузки ресурсов? - PullRequest
7 голосов
/ 23 января 2009

Так как одна веб-страница может содержать много внешних ресурсов: внешний javascript, внешний css, изображения, апплеты, flash и т. Д., Обычно я придерживаюсь мнения, что событие window.onload вызывается, когда все связанные ресурсы завершена загрузка (хотя внешние ресурсы обычно загружаются в несколько потоков или процессов реализацией браузера). Обычный случай может работать в большинстве случаев. Но ... что если последовательность загрузки не та, которую я воспринимаю как должное, какая-то ошибка в JavaScript может появиться где-то и когда-нибудь.

После некоторого поиска я обнаружил, что это не тот случай, о котором я обычно думаю. На этой странице: https://web.archive.org/web/1/http://articles.techrepublic%2ecom%2ecom/5100-10878_11-5214317.html, кажется, что изображения не загружаются при запуске события onload. Но отсюда window.onload vs , мне кажется, изображения загружаются при срабатывании onload. Для меня это еще больше путаницы по этой ссылке http://forums.mozillazine.org/viewtopic.php?f=25&t=413504&start=0&st=0&sk=t&sd=a.

Итак, моя первая часть вопроса: все ли ресурсы действительно загружены при запуске window.onload?

Другая тесно связанная часть вопроса: каков порядок загрузки ресурсов до запуска window.onload? Я знаю, что для внутренних ресурсов, таких как внутренний javascript или css, порядок загрузки находится сверху вниз страницы (если только в IE не используется отложенный скрипт, как здесь сказано Получение уведомлений о загрузке DOM страницы (но до window.onload) ). Но как насчет внешних ресурсов javascript и css? Например, если я напишу свою страницу так:

 <external stylesheet...>
 <external javascript #1...>
 <external javascript #2...>
 <script>
  .....
  window.onload=....
  </script>

Тогда, предполагая, что функция во "external javascript # 2" вызывает функцию во "external javascript # 1", могу ли я быть уверен, что она ВСЕГДА работает? Также, если window.onload вызывает функцию из "внешнего javascript # 1", она также работает как ожидалось?

Вы можете сказать последовательность загрузки ресурса и время запуска события window.onload зависит от реализации браузера, как сказано здесь Каков приоритет события в JavaScript? . Но мне все еще интересно, есть ли спецификация или соглашение в публике. Не могли бы вы отослать меня к ресурсу или рассказать факты, чтобы устранить путаницу?

Ответы [ 3 ]

3 голосов
/ 23 января 2009

Выезд Cuzillion . Он был написан Стивом Соудерсом (Steve Souders) из команды разработчиков Yahoo для оценки именно этих вещей.

Это сводится к следующему: браузеры загружают сценарии в том порядке, в котором они встречаются в документе, и вся остальная загрузка останавливается во время загрузки каждого сценария. Другие ресурсы (css / images) загружаются асинхронно, и вы не можете быть уверены, когда они завершатся.

Событие onload срабатывает, когда документ и его ресурсы script / style / image загружены, но вы, вероятно, не хотите ждать изображений, если вы делаете какой-либо JavaScript при загрузке страницы. Вместо этого используйте что-то вроде события «ready» в jQuery или запустите собственное событие «DOMReady», поместив тег script в конец тела:

<body>
    <!-- your page contents here -->
    <script type="text/javascript">
        // DOM is ready, do scripty stuff now
        DOMReady();
    </script>
</body>
0 голосов
/ 23 января 2009

Ссылка SO, которую вы предоставили, немного вводит в заблуждение; Загрузка тела и загрузка окна вызывают одинаковые события, но события не запускаются одновременно. Window.onload сработает перед загрузкой тела, как объясняет ваш первый ресурс.

По причинам интерпретации браузеры запрашивают ресурсы javascript в последовательном режиме, где они могут запрашивать все остальное параллельно. Вот почему иногда вы будете загружать страницу, и изображения будут загружаться не по порядку, а javascript, за исключением тех обстоятельств, которые вы подразумевали, загружает по порядку. Так что да, ресурсы будут загружены.

Кроме того, браузеры сначала оценивают функции js, поэтому у вас не должно возникнуть проблем с вызовом функции до ее явного определения. Однако это не будет работать с переменными.

Последнее, CSS интерпретируется сверху вниз; независимо от того, как они загружены, браузер будет интерпретировать правила, начиная с верха и заканчивая вниз.

0 голосов
/ 23 января 2009

Ресурсы скрипта загружаются до запуска onload. Однако imgs загружаются в ленивом асинхронном режиме не обязательно в том порядке, в котором они перечислены в документе.

Я также нашел, по крайней мере, в IE, что не все свойства элемента DOM правильно рассчитываются при нагрузке (например, размеры клиента и смещения могут быть равны 0, когда они должны иметь значение).

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...