2015-10-07 2 views
0

Я новичок в JS, и я не уверен, когда именно выполняются функции.Разница между загрузкой и скриптом в конце тела?

Пример:

<html> 
    <head> 
    <title>A</title> 
    <script src="myScript.js"></script> 
    </head> 
    <body onload="myFunction()"> 
    [Content here...] 
    </body> 
</html> 

Пример B:

<html> 
    <head> 
    <title>B</title> 
    <script src="myScript.js"></script> 
    </head> 
    <body> 
    [Content here...] 
    <script> 
     myFunction(); 
    </script> 
    </body> 
</html> 

Из того, что я читал до сих пор функция выполняется, когда парсер достигает его. Разве это не сделает пример А и В тем же? Является ли весь контент (например, таблица с текстом) страницы видимой на экране, когда myFunction() вызывается в B?

+0

onload будет запускаться после того, как вся веб-страница будет включать в себя изображения, аудио/видео, а до конца тега body - как событие DOMContentLoaded. – Rayon

ответ

2

Добавление <script> в конце корпуса, по существу, запускает его после того, как элементы обрабатываются до <script> (вы можете думать, что он работает, когда выполняется DOM тела). Хотя onload ждет не только для DOM, но и для всего содержимого, которое должно быть полностью загружено, например изображений.

+0

Если бы у меня была таблица с большим количеством текстового содержимого, которая занимает некоторое время для загрузки/рендеринга, будет ли все это видимо до выполнения скрипта? – John

0

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