HTML тег <script>

HTML теги

Значение и применение

Тег <script> используется для определения скрипта на стороне клиента (как правило на языке JavaScript). Элемент содержит внутри себя текст скрипта, либо он указывает на внешний файл скрипта, который задается с использованием атрибута src. Если элемент ссылается на внешний скрипт, то в этом случае элемент должен быть пустым.


Обращаю Ваше внимание, что элемент <script> обязательно должен иметь закрывающий тег </script> независимо от того, где скрипт содержится (внутри тега, или указан как URL адрес для внешнего скрипта).


Поддержка браузерами

ТегChrome
Chrome
Firefox
Firefox
Opera
Opera
Safari
Safari
Internet Explorer
IExplorer
Microsoft Edge
Edge
<script>ДаДаДаДаДаДа

Атрибуты

АтрибутЗначениеОписание
asynchtml5asyncЛогический атрибут, который указывает, что скрипт выполняется асинхронно (только для внешних скриптов).
charsetcharsetЗадает кодировку символов, используемых во внешнем файле скрипта.
crossoriginhtml5anonymous
use-credentials
Атрибут определяет, используется ли CORS при загрузке скрипта.
deferdeferЯвляется логическим атрибутом, который указывает, что скрипт выполнится, когда страница загрузится полностью (только для внешних скриптов).
srcURLУказывает URL адрес внешнего файла скрипта (допускается использование как относительных, так и абсолютных адресов).
typemedia_typeУказывает MIME-тип скрипта.

Пример использования

<!DOCTYPE html>
<html>
	<head>
		<title>Пример использования элемента <script></title>
	</head>
	<body>
		<p id = "test">Нажми кнопку, чтобы изменить параграф.</p>
		<script>
	  function chg() { // создаем функцию
	    var x = document.getElementById("test"); // находим элемент с глобальным атрибутом id "test"
	    x.style.color = "white";  // задаем стиль (значение для цвета текста - белый)
	    x.style.backgroundColor = "orange"; // задаем стиль (значение для заднего фона - оранжевый)
	  }
	</script>
		<button onclick = "chg()"> Нажми!</button> <!-- указываем в атрибуте событий onclick, что скрипт срабатывает (наша функция) при клике левой кнопки мыши на элементе) -->
	</body>
</html>

Результат нашего примера:

Нажми кнопку, чтобы изменить параграф.

Отличия HTML 4.01 от HTML 5

В HTML 5 был добавлен атрибут async и удалён атрибут xml:space. В HTML5, атрибут type больше не требуется для JavaScript (значение атрибута по умолчанию - "text/javascript").

Значение CSS по умолчанию

script {
display: none;
}

Поддержка глобальных атрибутов

Элемент поддерживает "глобальные атрибуты".

Атрибуты событий

Элемент поддерживает "атрибуты событий".

HTML теги