Я считаю, что javascript может быть где угодно (почти), но я почти всегда вижу его между <head></head>. Я использую jquery и хочу знать, по какой-то причине это должно быть в заголовках, или если что-то сломает, если я его переведу. Спасибо.
EDIT: почему он почти всегда находится в заголовках?
JavaScript выполняется везде, где он находится в документе. Если вы поместите встроенный JavaScript в тело, он будет выполнен, когда браузер придет к нему. Если вы используете $(document).ready(...) для выполнения вещей, то позиционирование не должно иметь значения. В противном случае вы можете найти угловые случаи, когда это имеет значение. В общем, это не имеет значения. Скрипты попадают в тег head в основном из традиций.
Нет, это может быть где угодно. На самом деле, иногда это хорошая идея положить его в нижней части документа. Для объяснения, почему, см. http://developer.yahoo.com/performance/rules.html#js_bottom.
В основном браузеры останавливают страницу рендеринга до тех пор, пока файлы .js не будут полностью загружены и обработаны. Поскольку они обрабатывают страницу по мере поступления HTML, более поздние .js файлы ссылаются, тем лучше будет пользовательский интерфейс.
Итак, трюк состоит в том, чтобы включить только абсолютно важные сценарии в head и загрузить оставшиеся в конец страницы.
Все останавливается, когда браузер читает тег script, пока он не обработает его. Таким образом, ваша страница будет выглядеть быстрее, если вы поместите теги script вниз, насколько это возможно - идеально как раз перед тегом тега конца. Очевидно, что общее время загрузки будет таким же.
Вам нужно будет убедиться, что вы фактически не вызываете какие-либо функции jQuery до тех пор, пока не будет включен jQuery.
В эти дни JS меняется так быстро, что каждую неделю появляются новые фреймворки, и каждый из них заявляет, что его защитники являются "коленями пчелы".
Гамбо прав, говоря, что на тег скрипта можно ссылаться везде, где поддерживается встроенный элемент, но выбор загрузки внешнего файла JS или включения кода JS в тег - это решение, принимаемое индивидуально в каждом конкретном случае.
Да, браузер перестанет загружать JS, когда он будет проанализирован, и поэтому вам нужно подумать о том, как это повлияет на скорость и функциональность загрузки страницы.
По состоянию на середину 2015 года (популярный ответ был в июле 2009 года), для предоставления мобильному приоритету скорости загрузки страницы требуется ограничение в два запроса для мобильной/сотовой мачты, что при 3G дает полезную нагрузку 28 КБ (2 x 14 КБ (да)). Вы должны рассмотреть "рисовать на экран" (как Google называет это) из 28k. Это должно предоставить пользователю достаточно содержимого страницы/интерактивности, чтобы убедиться, что они находятся на правильной странице или правильном пути. Jquery minified в настоящее время 87.6lkb, так что "просто не собираюсь резать горчицу!"
Вот почему большинство мобильных страниц сидят в течение нескольких секунд, прежде чем загружать что-либо, даже на 4G! Не позволяй этого. Скорость страницы важна, и пользователи нажимают кнопку "Назад" до загрузки файла JQuery. При 3G+ полезная нагрузка в 28 Кб будет загружаться в течение <1 с, поэтому нет причин, по которым ваша страница не должна начать загружаться в это время. В следующий раз, когда вы нажмете ссылку на своем телефоне, посмотрите, как загружается панель загрузки, и подождите, пока она пройдет через все теги на следующей странице!
Не структурируйте свою страницу на основе 7-летних постов на SO (даже если это не так, просто устарели). Решите, где нужен каждый фрагмент кода, и убедитесь, что пользователь может использовать самые важные аспекты страницы, прежде чем пытаться загрузить 6 платформ JS, которые реализуют экстравагантные визуальные функции и обширную привязку данных для вашей страницы.
Кстати, Google предпочитает толкать JS вниз, потому что код аналитики Google должен загружаться последним.
Подумайте, прежде чем код!
Нет. SCRIPT не только относится к head.misc element, но также как special элемент и, следовательно, везде, где разрешены встроенные элементы. Таким образом, вы можете поместить SCRIPT везде, где разрешены встроенные элементы:
<p>foo <script>document.write("bar")</script></p>
Фактически, некоторые рекомендуют помещать SCRIPT элементы в конце BODY непосредственно перед закрывающим тегом, чтобы весь документ анализируется до загрузки JavaScript. Это значит, что JavaScript не блокирует параллельные загрузки.
Собственно, по соображениям производительности вы почти всегда хотите разместить теги script в нижней части страницы. Зачем? Вы хотите, чтобы ваша структура страницы и ваш CSS загружались первым, чтобы пользователь сразу увидел страницу. Затем вы хотите, чтобы весь ваш код, управляемый поведением, загружался последним. YSlow является хорошим расширением Firefox, которое покажет вам оценку производительности. Один из элементов, на котором он оценивается, - это у вас есть javascript внизу, а не сверху.
Просто будьте осторожны с плохими последствиями задержки, которые вы можете иметь, в зависимости от браузера пользователя и где именно вы размещаете свой Javascript на странице - см. почти все Стив Соудерс должен сказать, в том числе видео его лекций в Стэнфорде, и плоды его трудов, оставленные, например, здесь (поместите скрипты внизу страницы в максимально возможной степени и т.д.).
Потому что вы не хотите, чтобы JavaScript был смешан с HTML-контентом с поведением. Желательно, чтобы это было в отдельном файле.
Наличие JS в других местах имеет преимущества и дезактивации - оно будет выполняться в разное время, например, и вы можете записать в документ из javascript, расположенного в теле.
Он может находиться в теге head или body. Просто имейте в виду, что он будет выполняться всякий раз, когда будет прочитан, а не обязательно, когда документ будет загружен. Посмотрите here.
В некоторых случаях да script может не работать, если он находится в неправильном месте. Некоторые JavaScript необходимо выполнить после определенного HTML-элемента, другие должны быть точно там, где вы хотите, чтобы ваш script вывод отображался, другие должны быть в начале документа. Это действительно зависит от того, как написан код. Если вы не уверены, вы должны выполнить свой код на window.load или DOMready: http://www.javascriptkit.com/dhtmltutors/domready.shtml