Как добавить JS скриптов в HTML


Тег HTML <script> используется для вставки JavaScript в HTML страницу.

Пишем в HTML Документ
Пример ниже заполняет элемент <p> информацией о текущей дате в HTML документе:

Пример
<html>
<body>

<h1>Моя Первая Веб Страница</h1>

<script type=»text/javascript»>
document.write(«<p>» + Date() + «</p>»);
</script>

</body>
</html>

Замечание: Старайтесь избегать использование document.write() в реальном коде JavaScript. Целая HTML страница будет переписана, если document.write() используется внутри функции, или после того, как страница загрузилась. Однако, document.write() — легкий способ продемонстрировать работу JavaScript в учебном курсе.

Изменение HTML Элементов
Пример ниже вставляет текущую дату в существующий элемент <p>:

Example
<html>
<body>

<h1>Моя Первая Веб Страница</h1>

<p id=»demo»></p>

<script type=»text/javascript»>
document.getElementById(«demo»).innerHTML=Date();
</script>

</body>
</html>

Замечание: Для манипулирования HTML элементами JavaScript использует метод DOM getElementById(). Этот метод получает доступ к элементу с указанным идентификатором id.

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

Внутри тега <script> используйте атрибут type для определения языка сценариев.

<script> и </script> говорят, где JavaScript начинается и заканчивается:

<html>
<body>
<h1>Моя Первая Веб Страница</h1>

<p id=»demo»>Это параграф.</p>

<script type=»text/javascript»>
… некоторый JavaScript код …
</script>

</body>
</html>
Строки между <script> и </script> содержат JavaScript и исполняются браузером.

В этом случае браузер заменит содержимое HTML элемента с идентификатором id=»demo», на текущую дату:

<html>
<body>
<h1>Моя Первая Веб Страница</h1>

<p id=»demo»>Это параграф.</p>

<script type=»text/javascript»>
document.getElementById(«demo»).innerHTML=Date();
</script>

</body>
</html>
Без тегов <script>, браузер будет интерпретировать «document.getElementById(«demo»).innerHTML=Date();» как обычный текст и просто выведет его на страницу:

Некоторые Браузеры Не Поддерживают JavaScript
Браузеры, которые не поддерживают JavaScript, будут отображать JavaScript как обычное содержимое страницы.

Для предотвращения этого в стандарт JavaScript включена возможность добавления HTML тега комментария, чтобы «спрятать» JavaScript.

Просто добавьте тег комментария HTML <!— перед первым предложением JavaScript, и —> (конец комментария) после последнего предложения JavaScript, например:

<html>
<body>
<script type=»text/javascript»>
<!—
document.getElementById(«demo»).innerHTML=Date();
//—>
</script>
</body>
</html>
Два прямых слэша в строке, где закрывается комментарий (//), это символ комментирования JavaScript. Это препятствует интерпретатору JavaScript «выполнить» тег —>.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Перейти к верхней панели