Зачем ставить JavaScript в голову

Если вполне приемлемо поставить JavaScript прямо перед </body>, что является хорошей причиной для его сохранения в <head>?

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

Однако я не вижу никаких аргументов в пользу того, почему он должен храниться в <head>. Я спрашиваю, потому что я не очень сильный разработчик JavaScript, и из всего, что я читал и видел, стандарт состоит в том, чтобы сохранить большинство JavaScript-кода и внешних ссылок в <head>.

Ответ 1

Все, что должно быть в голове, должно быть заполнено до того, как тело загрузится, поэтому, как правило, это плохая идея разместить там javascript. Если вы нуждаетесь что-то во время загрузки тела или хотите ускорить некоторый ajax, тогда было бы уместно поместить его в голову.

Ответ 2

Причиной этого является то, что Head загружается перед телом. Любой динамический код javascript, который будет выполняться в теле при загрузке, будет выполняться правильно.

Если у вас есть javascript, который находится непосредственно перед тегом </body>, тогда любые вызовы javascript, сделанные для функций вашей страницы при загрузке, будут ошибочными.

Итак, да, добавление javascript перед тегом </body> будет загружаться быстрее. Но только если ваш javascript будет выполнен после загрузки страницы с помощью кликов, например.

Ответ 3

Если вам нужен javascript для выполнения чего-либо на странице, и вы не хотите, чтобы конечный пользователь просматривал контент до тех пор, пока это не завершится, вы должны включить его в голову. Это действительно зависит от каждого отдельного случая.

Большую часть времени, поставив его на дно, действительно лучше для оптимизации загрузки страницы, так как пользователь увидит весь контент на странице, прежде чем JS начнет загрузку.

Ответ 4

Единственная причина поставить JS в голову - это сценарии, которые изменяют, как браузер действительно отображает страницу. Например, Modernizr.js загружается в голову, чтобы он мог делать такие вещи, как добавление поддержки элементов HTML5 и управление классами в теге <html> до того, как страница начнет рендерить.

В противном случае ваш JS должен находиться в нижней части страницы.

Ответ 5

В прошлом единственной причиной для включения JS в голову было использование сценариев, которые изменяют способ отображения браузером страницы (как Chris Pratt). Сегодня это уже не так, но:

Если вы все еще много заботитесь о поддержке и производительности в IE и 10, он остается лучшим подходом, чтобы ваши теги script отображали последние теги вашего тела HTML. Таким образом, вы уверены, что остальная часть DOM была загружена, и вы не будете блокировать и рендеринг.
Если вам больше неинтересно об IE и 10, вы можете поместить свои сценарии в начало своего документа и использовать defer, чтобы убедиться, что они запускаются только после загрузки DOM (<script type="text/javascript" src="path/to/script1.js" defer></script>). Красота этого подхода заключается в том, что defer не блокирует загрузку остальной части DOM. Если вы все еще хотите, чтобы ваш код работал в IE < 10, не забудьте обернуть свой код в window.onload даже, хотя!

Ответ 6

Значок заголовка загружается перед Телом, поэтому Javascript, необходимый для загрузки сайта должным образом, должен быть помещен туда, но если это не требуется, большинство людей считают, что лучше положить его в конец тега вашего тела.

Ответ 7

Традиционно страницы не использовались для проверки (будь то XHTML Strict validation или соответствие WAI-AAA, я не могу точно запомнить, что не удалось, но что-то не получилось, когда скрипты были в теле), Обычно это согласуется с рекомендацией поместить все скрипты во внешние файлы и привязать их к тегу script src="".

Логика: Возможно, это рекомендовано W3C как способ сохранения тела для самой семантической разметки. Я думаю, что исторически эта логика была важна в те дни, когда интернет был в целом намного медленнее - некоторые браузеры были настроены на отказ от сценариев, стилей и изображений на основе диагностики и настроек подключения к Интернету, а наличие script в голове - это способ сообщать браузерам "это нормально, чтобы отклонить этот script, если проблемы с подключением гарантируют его", когда сценарии в теле семантически считаются более неотъемлемыми для контента. Это, однако, такой нюанс, и на основе, вероятно, устаревших рекомендаций W3C, поэтому мне было бы трудно найти браузер, который фактически работает таким образом в эти дни.

В настоящее время он влияет только на поведение страницы при рендеринге.

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

Ответ 8

Вот вопрос вроде "windows" или "mac", я думаю, Если вы поместите весь свой источник JS в главный раздел сайта, вы останетесь сильным для W3C. Другой случай всегда в голове должен быть загружен для тела Element. И для DOM правильно загружена. JavaScript-фреймы, такие как jQuery, имеют функции типа $(document).ready() для проверки загрузки полной DOM. Таким образом, вы можете сделать все свое JS в теге заголовка. Мое предпочтение заключается в загрузке всех JS в конце тела, но это решение предоставляется каждому разработчику самостоятельно:)