JavaScript Куда
Тег <script>
В HTML код JavaScript должен быть вставлен между тегами <script> и </script>.
Пример
<script>
document.getElementById("demo").innerHTML = "My First JavaScript";
</script>
В старых примерах JavaScript может использоваться атрибут Type: <тип скрипта = "Text/JavaScript">.
Атрибут Type не является обязательным. JavaScript является языком сценариев по умолчанию в HTML.
Функции и события JavaScript
функция JavaScript — это блок кода JavaScript, который может быть выполнен при вызове.
Например, функция может быть вызвана при возникновении события , например при нажатии пользователем кнопки.
Вы узнаете гораздо больше о функциях и событиях в более поздних главах.
JavaScript в <head> или <BODY>
В документ HTML можно поместить любое количество скриптов.
Скрипты можно размещать в <BODY> или в разделе <head> страницы HTML или в обоих.
JavaScript в <head>
В этом примере функция JavaScript помещается в раздел <head> страницы HTML.
Функция вызывается (вызывается) при нажатии кнопки:
Пример
<!DOCTYPE html>
<html><head>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>
</head>
<body>
<h1>A Web Page</h1>
<p id="demo">A Paragraph</p>
<button type="button" onclick="myFunction()">Try
it</button>
</body>
</html>
JavaScript в <BODY>
В этом примере функция JavaScript помещается в раздел <BODY> страницы HTML.
Функция вызывается (вызывается) при нажатии кнопки:
Пример
<!DOCTYPE html>
<html>
<body>
<h1>A Web Page</h1>
<p id="demo">A Paragraph</p>
<button type="button" onclick="myFunction()">Try
it</button>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>
</body>
</html>
Размещение скриптов в нижней части элемента <BODY> улучшает скорость отображения, поскольку компиляция скриптов замедляет отображение.
Внешний JavaScript
Скрипты также могут быть размещены во внешних файлах:
Внешний файл: myScript.js
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
Внешние сценарии являются практичными, когда один и тот же код используется на многих различных веб-страницах.
Файлы JavaScript имеют файл Extension . js.
Чтобы использовать внешний сценарий, поместите имя файла сценария в атрибут src (Source) тега <script>:
Пример
<script src="myScript.js"></script>
Можно поместить ссылку на внешний скрипт в <head> или <BODY>, как вам нравится.
Сценарий будет вести себя так, как если бы он находился именно там, где находится тег <script>.
Внешние скрипты не могут содержать теги <script>.
Внешние преимущества JavaScript
Размещение скриптов во внешних файлах имеет ряд преимуществ:
- Он отделяет HTML и код
- Это упрощает чтение и поддержку HTML и JavaScript
- Кэшированные файлы JavaScript могут ускорить загрузку страниц
Чтобы добавить несколько файлов скриптов на одну страницу-используйте несколько тегов script:
Пример
<script src="myScript1.js"></script>
<script src="myScript2.js"></script>
Внешние ссылки
Внешние сценарии можно ссылаться с полным URL-адресом или с помощью пути относительно текущей веб-страницы.
В этом примере используется полный URL-адрес для связывания с сценарием:
Пример
<script src="https://www.html5css.com/js/myScript1.js"></script>
В этом примере используется сценарий, расположенный в указанной папке на текущем веб-узле:
Пример
<script src="/js/myScript1.js"></script>
Этот пример связывается с сценарием, расположенным в той же папке, что и текущая страница:
Пример
<script src="myScript1.js"></script>
Подробнее о путях к файлам можно прочитать в разделе пути к файлам HTMLглавы.
