JavaScript Использование


Код сценария JavaScript в HTML должен быть размещён между<script>и</script>тегами.

Код сценария JavaScript можно разместить в<body>и<head>разделе HTML-страницы.


Тег <script>

Чтобы вставить JavaScript в HTML-страницу, используйте тег <script>.

Теги <script> и </script> сообщают JavaScript, где начинать и заканчивать.

Строки кода между <script> и </script> содержат JavaScript:

<script> alert("Мой первый JavaScript"); </script>

Вам не нужно понимать код выше. Просто поймите, что браузер интерпретирует и выполняет код JavaScript между <script> и </script>.

lamp В тех старых примерах мог использоваться type="text/javascript" в теге <script>. Это больше не требуется. JavaScript — это язык сценариев по умолчанию во всех современных браузерах и в HTML5.


JavaScript в <body>

В этом примере JavaScript записывает текст в HTML <body> при загрузке страницы:

Пример

<!DOCTYPE html> <html> <body> . . <script> document.write("<h1>Это заголовок</h1>"); document.write("<p>Это абзац.</p>"); </script> . . </body> </html>

Попробуйте сами »


Функции и события JavaScript

Инструкции JavaScript в примере выше выполняются при загрузке страницы.

Обычно нам нужно выполнять код, когда происходит событие, например, когда пользователь нажимает кнопку.

Если мы поместим код JavaScript в функцию, мы можем вызвать эту функцию, когда происходит событие.

Вы узнаете больше о функциях и событиях JavaScript в следующих главах.


JavaScript в <head> или <body>

В HTML-документе можно разместить неограниченное количество скриптов.

Скрипты можно размещать в разделе <body> или <head> HTML-страницы, либо в обоих разделах.

Обычно функции размещают в разделе <head> или в нижней части страницы. Так они находятся в одном месте и не мешают содержимому страницы.


Функции JavaScript в <head>

В этом примере мы размещаем функцию JavaScript в разделе <head> HTML-страницы.

Функция вызывается при нажатии кнопки:

Пример

<!DOCTYPE html> <html> <head> <script>function myFunction() { document.getElementById("demo").innerHTML="My first JavaScript function"; }</script> </head> <body> <h1>Моя веб-страница</h1> <p id="demo">Абзац</p> <button type="button" onclick="myFunction()">Попробуйте сами</button> </body> </html>

Попробуйте сами »


Функции JavaScript в <body>

В этом примере мы размещаем функцию JavaScript в разделе <body> HTML-страницы.

Функция вызывается при нажатии кнопки:

Пример

<!DOCTYPE html> <html> <body> <h1>Моя веб-страница</h1> <p id="demo">Абзац</p> <button type="button" onclick="myFunction()">Попробуйте сами</button> <script>function myFunction() { document.getElementById("demo").innerHTML="My first JavaScript function"; }</script> </body> </html>

Попробуйте сами »


Внешний JavaScript

Вы также можете сохранить скрипт во внешнем файле. Внешние файлы часто содержат код, используемый несколькими веб-страницами.

Расширение файла для внешних файлов JavaScript — .js.

Чтобы использовать внешний файл, укажите файл .js в атрибуте "src" тега <script>:

Пример

<!DOCTYPE html> <html> <body> <script src="myScript.js"></script> </body> </html>

Попробуйте сами »

Вы можете разместить скрипт в <head> или <body>. Скрипты внутри тега <script> ведут себя точно так же, как внешне подключённые скрипты.

Код файла myScript.js выглядит следующим образом:

function myFunction() { document.getElementById("demo").innerHTML="Моя первая функция JavaScript"; }
lamp Внешние скрипты не могут содержать теги <script>.
Другие расширения