Я делал небольшой JavaScript (ну, скорее, как jQuery) какое-то время, и одна вещь, которую я всегда смущал, - это то, где я должен поместить свои скрипты в тег <head> или в тег <body>.Где разместить JavaScript?
Если кто-нибудь может прояснить эту проблему, это было бы здорово. Пример того, что должно идти, было бы идеально.
Возможный дубликат http://stackoverflow.com/questions/1013112/where-should-i-declare-javascript-files-used-in-my-page-in-head-head-or-near – CMS
Лучшие практики из google и yahoo сказать, что для выполнения, JavaScript должен всегда ставить во внешнем файле, а также связанный с вашей страницей с <script> тегом, расположенным в нижней части HTML, непосредственно перед закрытием <body> элемент.
Это позволяет браузеру отображать всю страницу сразу, а не останавливаться на оценке javascript.
Проблема с этим заключается в том, что отображается «бесфункционная» страница. Кстати, это совпадение, что у нас обоих есть один и тот же представитель? (1666) –
Re: 'functionless': ваша страница должна работать без JS. И это, вероятно, будет только от 1/2 секунды до секунды между рендерингом страницы и оценкой JS (надеюсь). –
Вот что мне было интересно. Если по какой-то причине я поместил свой JavaScript в свой тег '
', будет ли это иметь разницу по сравнению с тем, что я положил его в начало тега 'Вы упомянули три места:
В тегах;
В HTML; и
Во внешнем файле.
Позвольте мне обратиться к каждому из них.
Лучшая практика состоит в том, чтобы иметь общий Javascript в одном или нескольких внешних файлах и чем меньше файлов, тем лучше, поскольку каждый загруженный файл JS блокирует загрузку страницы до загрузки этого JS-файла.
Слово «общий» чрезвычайно важно. Это означает, что вы не хотите указывать код Javascript, специфичный для страницы, в этом внешнем файле по причинам кэширования. Допустим, у вас есть сайт с 1000 страницами. На каждой странице есть JS-код, специфичный для него. Это может быть 1000 различных файлов или один действительно большой файл, который выполняет много ненужного кода (например, ищет идентификаторы, которые не находятся на этой конкретной странице, но находятся на одном из 999 других). Ни один из этих результатов не является хорошим.
Первый дает вам небольшой импульс кеширования. У второго может быть ужасное время загрузки страницы.
Так что вы делаете все общие функции в одном JS-файле, где только этот файл JS содержит только. На каждой странице HTML вы вызываете функции JS, необходимые для этой страницы.
В идеале ваши файлы JS также кэшируются. Лучшей практикой является использование длинного фьючерсного заголовка HTTP Expires и номера версии, поэтому JS-файл загружается только один раз каждым браузером независимо от того, сколько страниц они посещают. Когда вы меняете файл, вы меняете номер версии, и это заставляет перезагружать. Используя время изменения (время последнего изменения файла JS) является общей схемой, давая URL, как:
<script type="text/javascript" src="/js/script.js?1233454455"></script>
, где это время изменения автоматически генерируется. Ваш веб-сервер настроен на обслуживание файлов JS с соответствующим заголовком Expires.
Для того, чтобы смешивать внешние файлы и встроенные скрипты в (imho) наилучшим образом.
Последнее место, о котором вы говорили, было в теге. Здесь это в некоторой степени зависит от того, какие библиотеки и рамки JS вы используете.Я большой поклонник jQuery, который поощряет ненавязчивый Javascript. Это означает, что вы (надеюсь) не помещаете Javascript в свою разметку вообще. Таким образом, вместо:
<a href="#" onclick="doStuff(); return false;">do stuff</a>
вы:
<a href="#" id="dostuff">do stuff</a>
с Javascript:
$(function() {
$("#dostuff").click(doStuff);
});
Вы имеете в виду '$ ('# dostuff'). Click (doStuff);' на основе вашего HTML. =) Спасибо за отличное описание! –
@Jeff Я действительно! Исправлено, спасибо за это. – cletus
Я на самом деле сделал больше работы с PHP, а затем JS, и когда вы описали вначале действие сохранения важных функций в одном файле, это напомнило мне, как я организую свои функции PHP - вот так! Когда я пишу свой код jQuery, он никогда не входит в мои теги. Мой реальный вопрос был в значительной степени, где я должен хранить свои теги '
Вы можете уточнить в теге или в теге? –
Под «в теге» я имел в виду между тегами '' и '