Как расположение тега сценария на странице влияет на функцию JavaScript, которая определена в ней?

Я прочитал, что вы должны определить свои функции JavaScript в , но как расположение (будь то в , или любом другом теге) влияет на функцию JavaScript.

В частности, как это влияет на объем функции и где вы можете ее назвать?

Говорить людям, чтобы добавить только в голове, звучит как разумная вещь, но, как говорили другие, есть много причин, почему это не рекомендуется или даже практично – в основном скорость и способ создания HTML-страниц динамически.

Вот что говорит спецификация HTML 4 :

Элемент SCRIPT помещает скрипт в документ. Этот элемент может появляться любое количество раз в HEAD или BODY документа HTML.

И некоторые примеры HTML. Разве это не выглядит довольно отформатированным здесь 🙂

 < !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">   A document with SCRIPT        

И что-то с нетерпением жду в HTML 5 :

Новый атрибут async в :

Примечание. Существуют способы [sic] выполнить скрипт:

Асинхронный атрибут «true»: скрипт будет выполнен несинхронно с остальной частью страницы, поэтому скрипт будет выполнен, пока страница продолжит parsing.

Асинхронный атрибут «false», но атрибут defer – «true»: скрипт будет выполнен, когда страница будет закончена с синтаксическим parsingом.

Обычные правила игры все еще стоят; не используйте материал до его определения. 🙂

Кроме того, обратите внимание, что совет «поставить все внизу» не является единственным правилом в книге – в некоторых случаях это может оказаться невыполнимым, и в других случаях может возникнуть смысл поставить сценарий в другое место.

Основная причина размещения сценария внизу документа – для производительности, сценарии, в отличие от других HTTP-запросов, не загружаются параллельно, то есть они замедляют загрузку остальной части вашей страницы. Еще одна причина для установки сценариев внизу, так что вам не нужно использовать какие-либо функции «DOM ready». Поскольку тег скрипта находится ниже всех элементов, DOM будет готов к манипуляции!

EDIT: Прочтите это: http://developer.yahoo.com/performance/rules.html#js_bottom

Одним из аспектов размещения является производительность. См. Эту замечательную статью в дискуссиях YSlow о том, почему иногда рекомендуется помещать их внизу документа.

Что касается проблем сферы действия, обычные правила видимости для Javascript (вары, определенные внутри или вне функций, локальных, глобальных, закрытий и т. Д.), Насколько я знаю, не затрагиваются.

Позиция тега скрипта имеет значение. Если вы привязываете функцию к элементу документа, элемент документа должен быть загружен первым, прежде чем мы начнем реализацию функции. предположим, что getTeachers () является функцией в файле getTeachers.js. Это даст вам сообщение об ошибке:

   Unit Teachers      

Он дает ошибку перед первым загрузкой главы и не может найти элемент с указанным идентификатором. Код ниже:

   Unit Teachers     

Это не так. Большинство программных скриптов разбросаны по всей странице. Из-за этого я редко видел проблемы (и только из старых браузеров).

Если ваш сценарий ссылается на идентификатор на странице, и страница не была отображена (то есть сценарий перед HTML, или ваш скрипт выполняется с onload, а затем DOM готов), вы также можете получить сообщение об ошибке.

Если вы вытащите Javascripts через XMLHttpRequest, как сказал Диодей, это, вероятно, не сработает. В моем случае ошибки не было, браузер просто игнорирует новый скрипт (ы).

Я закончил использовать это, не очень элегантно, но работает для меня до сих пор:

http://zeta-puppis.com/2006/03/07/javascript-script-execution-in-innerhtml-the-revenge/

Как использовать execJS: http://zeta-puppis.com/2006/02/23/javascript-script-execution-in-innerhtml/

Примечание. Следите за < в этой строке: for(var i=0;i

Если у вас есть встроенный скрипт (внешние функции), который находится перед функциями, которые он может вызвать, вы можете получить сообщение об ошибке, поскольку они могут быть недоступны. Не сказать, что это всегда произойдет, просто, что это может быть в зависимости от типа браузера или версии.

Правила просмотра Javascript аналогичны правилам perl – вы можете вызывать любую функцию на текущем или любом более высоком уровне видимости. Единственное ограничение состоит в том, что функция должна быть определена во время ее вызова. Позиция в источнике не имеет значения – важна только позиция во времени.

Вам следует избегать размещения сценариев в если это возможно, поскольку это замедляет отображение страницы (см. Ссылку Alan).