html теґ <script>

Тег <script> використовується для вставки скриптів (сценаріїв) у html-документ.

Сам скрипт може розташовуватися як у html-документі (всередині тегів head або body), так і в зовнішньому файлі, такий підхід дозволяє використовувати одні і ті ж загальні функції на багатьох веб-сторінках і прискорює їх завантаження, тому що зовнішній файл кешуєтся при першому завантаженні і скрипт виконується швидше при наступних викликах.

Скрипти, які повинні виконуватися в першу чергу, звичайно поміщають в заголовок документа.

Елемент <script> в собі містить скрипт, або, за допомогою атрибута src, вказує на зовнішній файл зі сценаріями.

9888ac4e6e6b546e8902750b17a98b3e.png

Нотатка:

Якщо атрибут "src" присутній, елемент <script> повинен бути порожнім.

Порада:

Також зверніть увагу на елемент <noscript> для користувачів, у яких скрипти підтримуються з обмеженими можливостями, або мають браузер, який не підтримує скрипти на стороні клієнта.

Нотатка:

Скрипт виконується:

  • Якщо async="async": Сценарій виконується асинхронно з іншої частини сторінки (сценарій буде виконуватися, поки сторінка продовжує завантажуватись)
  • Якщо async="async" не вказано, але вказано defer="defer": Скрипт виконується, після повного завантаження сторінки.
  • Якщо async та defer не вказані: Сценарій витягується і виконується відразу, до того, як браузер повністю завантажить сторінку
Нотатка:

Тег <script> може розташовуватися в заголовку або тілі HTML-документа в необмеженій кількості.

Нотатка:

Розміщення скрипта в зовнішньому файлі має перевагу в тому випадку, якщо до одного й того ж скрипта звертаються кілька html-документів. До того ж зовнішній файл кешуюється браузером, що в цілому прискорює загальну роботу сайту.

Синтакс

<script type="...">...</script>
Атрибут Опис атрибута
async Завантажує скрипт асинхронно.
charset Задає кодування символів, які використовуються в зовнішньому файлі
defer Відкладає виконання скрипта до тих пір, поки вся сторінка не буде завантажена повністю.
language Встановлює мову програмування на якій написаний скрипт.
src Адреса скрипта з зовнішнього файлу для імпорту в поточний документ.
type Визначає тип вмісту тега <script>.
xml:space Визначає, чи повинні бути збережені пробіли в коді
Атрибут Опис атрибута
accesskey

Дозволяє активувати або сфокусуватись на елементі за допомогою заданого сполучення клавіш.

class

Визначає один або кілька класів, щоб зв’язати елемент з таблицею стилів (CSS).

draggable

Визначає чи можна перетягувати елемент.

Більше інформації про загальні атрибути за посиланням Загальні атрибути в html.

Теґ <script> не підтримує жодних атрибутів подій.

Більше інформації про html події за посиланням Атрибути подій в html.

Переглядачі

Переглядач

1+

1+

1+

3.5+

3+

12+

Переглядач

1+

1+

1+

1+

Приклади


Найпростіший приклад використання HTML теґа <script>

See the Pen Script1_css_in_ua by css.in.ua (@css_in_ua) on CodePen.

Найпростіший приклад використання HTML теґа <script>

See the Pen Script_css_in_ua by css.in.ua (@css_in_ua) on CodePen.

Різниця між HTML 4.01 та HTML5


Атрибут "type" обов`язковий в HTML 4, але необов'язково в HTML5.

Атрибут "async" з`явився тільки в HTML5.

HTML 4.01 атрибут: "xml:space», не підтримується в HTML5.

Різниця між XHTML та HTML


У XHTML, вміст всередині скриптів оголошується як #PCDATA (замість CDATA), це означає, що об'єкти будуть оброблятися.

В XHTML, всі спеціальні символи повинні бути закодовані, або весь зміст має бути обгорнутий всередині секції CDATA:

<!--[CDATA[ var i = 10;
 if (i > 5) {
   // some code
 }
 ]]-->
 ```

CSS стиль без задання

script {
    display: none;
}

Додаткові посилання

Всі Коментарі (0)

Зареєструйся на сайті, аби мати змогу залишати коментарі. Зареєструватися  чи
Немає Коментарів