HTML и CSS с примерами кода

Тег <script> (от англ. script — скрипт, сценарий) предназначен для описания скриптов, может содержать ссылку на программу или её текст на определённом языке.

Скрипты могут располагаться во внешнем файле и связываться с любым HTML-документом. Такой подход позволяет использовать одни и те же общие функции на многих веб-страницах и ускоряет их загрузку, т. к. внешний файл кэшируется при первой загрузке, и скрипт вызывается быстрее при последующих вызовах.

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

Скрипты
  • canvas
  • noscript
  • script

Синтаксис

<script>
  .
.. </script> <script src="адрес"></script>

Закрывающий тег обязателен.

Атрибуты

async
Загружает скрипт асинхронно.
defer
Откладывает выполнение скрипта до тех пор, пока вся страница не будет загружена полностью.
src
Адрес скрипта из внешнего файла для импорта в текущий документ.
type
Определяет тип содержимого <script>.

async

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

Если задано сразу два атрибута — async и defer, то атрибут async игнорируется.

Синтаксис

<script async>
  . ..
</script>

Значения

Нет.

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

По умолчанию этот атрибут выключен.

defer

Атрибут defer откладывает выполнение скрипта до тех пор, пока вся страница не будет загружена полностью. Работает только при наличии атрибута src

.

Синтаксис

<script src="<адрес>" defer>
  ...
</script>

Значения

Нет.

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

По умолчанию этот атрибут выключен.

src

Загружает файл со скриптом из внешнего файла. Как только внешние инструкции полностью загружаются, браузер обрабатывает их, словно они были внедрены в текущий документ. Файлы со скриптами JavaScript обычно имеют расширение js и могут размещаться в любом доступном месте.

Преимуществ использования внешних файлов несколько. Внешний файл после первого обращения сохраняется в кэше браузера и при последующих вызовах загружается быстрее.

Кроме того, вызываемые функции удобно править в одном месте и код проще контролировать. Это особенно актуально, когда множество веб-страниц используют одни и те же скрипты.

Синтаксис

<script src="<адрес>">
  ...
</script>

Значения

В качестве значения принимается полный или относительный путь к файлу. Файл должен иметь расширение .js.

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

Нет.

type

Указывает MIME-тип для определённого языка.

Синтаксис

<script type="<MIME-тип>">
  ...
</script>

Значения

Атрибут type не чувствителен к регистру и обычно принимает следующие значения:

  • text/javascript — Для языка программирования JavaScript.
  • text/vbscript — Для языка VBScript.

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

text/javascript

Спецификации

  • WHATWG HTML Living Standard
  • HTML 5
  • HTML 4. 01 Specification
  • Subresource Integrity — атрибут integrity

Описание и примеры

<html>
  <head>
    <meta
      http-equiv="Content-Type"
      content="text/html; charset=utf-8"
    />
    <title>SCRIPT</title>
  </head>
  <body>
    <script type="text/javascript">
      document.write('<table border="1">')
      for (i = 1; i < 6; i++) {
        document.writeln('<tr>')
        for (j = 1; j < 6; j++)
          document.write('<td>' + i + j + '<\/td>')
        document.writeln('<\/tr>')
      }
      document.write('<\/table> ')
    </script>
  </body>
</html>

Ссылки

  • Тег <script>
    MDN (рус.)

Тег script

HTML5CSS.ru

ЛУЧШИЙ САЙТ ДЛЯ РАЗРАБОТЧИКОВ

❮Назад Полный HTML Ссылки Дальше ❯


Пример

Написать «Hello JavaScript!» в JavaScript:

<script>
document. getElementById(«demo»).innerHTML = «Hello JavaScript!»;
</script>


Определение и использование

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

Элемент <script> содержит операторы сценариев или указывает на внешний файл сценария через атрибут src.

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

Совет: Если вы хотите изучить JavaScript, посетите наш Учебник по JavaScript.


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

Элемент
<script> Да Да Да Да Да

Советы и примечания

Примечание: Если присутствует атрибут <src>, элемент <script> должен быть пустым.

Совет: Также посмотрите на <noscript> для пользователей, которые отключили скрипты в своем браузере, или браузер, который не поддерживает сценарии на стороне клиента.

Примечание: Существует несколько способов выполнения внешнего скрипта:

  • Если async=»async»: Скрипт выполняется асинхронно с остальной частью страницы (скрипт будет выполняться, пока страница продолжит разбор)
  • Если Async не присутствует и defer=»defer»: Сценарий выполняется после завершения синтаксического анализа страницы
  • Если не присутствует ни асинхронная, ни отложенная: сценарий извлекается и выполняется немедленно, прежде чем обозреватель продолжит разбор страницы


Различия между HTML 4,01 и HTML5

Атрибут «type» необходим в HTML 4, но необязателен в HTML5.

Атрибут «async» является новым в HTML5.

HTML 4,01 атрибут: «xml:space», не поддерживается в HTML5.


Различия между HTML и XHTML

В XHTML, содержимое внутри скриптов объявляется как #PCDATA (вместо CDATA), что означает, что сущности будут проанализированы.

Это означает, что в XHTML, все специальные символы должны быть закодированы, или все содержимое должно быть обернуто внутри раздела CDATA:

<script type=»text/javascript»>
//<![CDATA[
var i = 10;
if (i < 5) {
  // some code
}
//]]>
</script>


Атрибуты

= Новый в HTML5.

Атрибут Значение Описание
async async Указывает, что сценарий выполняется асинхронно (только для внешних скриптов)
charset charset Задает кодировку символов, используемую во внешнем файле сценария
defer defer Указывает, что сценарий выполняется после завершения синтаксического анализа страницы (только для внешних скриптов)
src URL Указывает URL-адрес внешнего файла сценария
type media_type
Указывает тип носителя сценария
xml:space preserve Не поддерживается в HTML5.
Указывает, следует ли сохранять пробелы в коде

Глобальные атрибуты

Тег <script> также поддерживает Глобальные атрибуты в HTML.


Похожие страницы

HTML Учебник: HTML Scripts

HTML DOM reference: Script Object

JavaScript Учебник: Learn JavaScript


Параметры CSS по умолчанию

В большинстве обозревателей элемент <script> будет отображаться со следующими значениями по умолчанию:

script {
    display: none;
}

❮Назад Полный HTML Ссылки Дальше ❯

Популярное

html картинка
как вставить картинку в html
цвет текста фона
размер текста html
цвет размер шрифта html
формы html
список html
таблица html
как сделать ссылку в html
html элементы



Copyright 2018-2020 HTML5CSS.

ru

Правила и Условия Политика конфиденциальности О нас Контакты

HTML-скрипт defer Атрибут

❮ Тег HTML

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


Определение и использование

Атрибут defer является логическим атрибутом.

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

Примечание: Атрибут defer предназначен только для внешних сценариев (следует использовать только в том случае, если присутствует атрибут src ).

Примечание: Существует несколько способов выполнения внешнего сценария:

  • Если присутствует async : Сценарий загружается параллельно парсингу страницы и выполняется, как только она доступно (до завершения синтаксического анализа)
  • Если присутствует defer (а не асинхронный ): скрипт загружается параллельно с анализом страницы и выполняется после завершения анализа страницы
  • Если ни асинхронный , ни присутствует defer : скрипт загружается и выполняется немедленно, блокировка синтаксического анализа до завершения скрипта

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

Числа в таблице указывают первую версию браузера, которая полностью поддерживает атрибут.

Атрибут
отложить 8,0 10,0 3,5 5,0 15,0

Syntax

.

Тег скрипта может содержать следующие атрибуты:

источник = " URL-адрес "

Атрибут src является необязательным. Если он присутствует, то его значением является URL-адрес , который идентифицирует файл .js . Загрузка и обработка страницы приостанавливаются, пока браузер извлекает, компилирует и выполняет файл. Содержание между должны быть пустыми.

Если атрибут src отсутствует, то текст содержимого между компилируется и выполняется. Скрипт не должен содержать последовательность

 
 

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

 
 

Обратная косая черта будет игнорироваться компилятором JavaScript.

Не используйте хак со скриптами. Это было предназначено чтобы скрипты не отображались в виде текста в браузерах первого поколения Нетскейп 1 и Мозаика. В этом нет необходимости уже много лет. должен сигнализировать о HTML-комментарии. Комментарии следует игнорировать, не компилируется и не выполняется. Кроме того, комментарии HTML не должны включать -- , поэтому сценарий, который уменьшает значение, имеет ошибку HTML.

язык = "javascript"

Этот атрибут устарел. Он использовался для выбора других языков программирования и определенных версий JavaScript. Вам это не нужно. Не используйте его.

тип="текст/javascript"

Этот атрибут является необязательным. Начиная с Netscape 2 языком программирования по умолчанию во всех браузерах был JavaScript. В XHTML этот атрибут является обязательным и ненужным. В HTML лучше его не указывать. Браузер знает, что делать.

отложить

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

for=" имя "событие=" имя "

Этот атрибут является функцией Microsoft для объявления обработчиков событий. Нет, это не так стандарт. Не используйте его.

Размещение

A заблокирует загрузку других компонентов страницы до тех пор, пока скрипт не будет загружен, скомпилирован и выполнен. Скрипт лучше вызывать как можно позже, чтобы загрузка изображений и других компонентов не задерживалась. Это может улучшить воспринимаемое и фактическое время загрузки страницы. Поэтому обычно лучше сделать все последними функциями перед . Внутристраничный