<script> HTML тег
Тег <script> використовується для вставки скриптів (сценаріїв) у html-документ.
Сам скрипт може розташовуватися як у html-документі (всередині тегів head або body), так і в зовнішньому файлі, такий підхід дозволяє використовувати одні і ті ж загальні функції на багатьох веб-сторінках і прискорює їх завантаження, тому що зовнішній файл кешуєтся при першому завантаженні і скрипт виконується швидше при наступних викликах.
Скрипти, які повинні виконуватися в першу чергу, звичайно поміщають в заголовок документа.
Елемент <script> в собі містить скрипт, або, за допомогою атрибута src, вказує на зовнішній файл зі сценаріями.
- Порада
-
Також зверніть увагу на елемент
автор: с3с<noscript>для користувачів, у яких скрипти підтримуються з обмеженими можливостями, або мають браузер, який не підтримує скрипти на стороні клієнта. - Нотатка
-
Розміщення скрипта в зовнішньому файлі має перевагу в тому випадку, якщо до одного й того ж скрипта звертаються кілька html-документів. До того ж зовнішній файл кешуюється браузером, що в цілому прискорює загальну роботу сайту.
автор: с3с - Нотатка
-
Якщо атрибут "src" присутній, елемент
автор: с3с<script>повинен бути порожнім. - Нотатка
-
Скрипт виконується:
- Якщо async="async": Сценарій виконується асинхронно з іншої частини сторінки (сценарій буде виконуватися, поки сторінка продовжує завантажуватись)
- Якщо async="async" не вказано, але вказано defer="defer": Скрипт виконується, після повного завантаження сторінки.
- Якщо async та defer не вказані: Сценарій витягується і виконується відразу, до того, як браузер повністю завантажить сторінку
- Нотатка
-
Тег
автор: с3с<script>може розташовуватися в заголовку або тілі HTML-документа в необмеженій кількості.
Синтаксис
<script type="...">...</script>| Атрибут | Опис |
|---|---|
| async | Завантажує скрипт асинхронно. |
| charset | Задає кодування символів, які використовуються в зовнішньому файлі |
| defer | Відкладає виконання скрипта до тих пір, поки вся сторінка не буде завантажена повністю. |
| language | Встановлює мову програмування на якій написаний скрипт. |
| type | Визначає тип вмісту тега <script>. |
| xml:space | Визначає, чи повинні бути збережені пробіли в коді |
| src | Адреса скрипта з зовнішнього файлу для імпорту в поточний документ. |
| Атрибут | Опис |
|---|---|
| accesskey | Дозволяє активувати або сфокусуватись на елементі за допомогою заданого сполучення клавіш. |
| class | Визначає один або кілька класів, щоб зв’язати елемент з таблицею стилів (CSS). |
| draggable | Визначає чи можна перетягувати елемент. |
| contenteditable | Дозволяє редагувати текст в середні тегу. |
| dir | Вказує напрямок тексту. |
| dropzone | Вказує, що робити з перетягувати елементи. |
| hidden | Приховує вміст елемента від перегляду. |
| id | Задає унікальний ідентифікатор для елемента. |
| lang | Визначає основну мову вмісту елемента |
| spellcheck | Вказує браузеру перевіряти чи ні правопис і граматику в тексті елемента. |
| style | Задає вбудований (inline) CSS стиль для елемента. |
| tabindex | Встановлює порядок отримання фокусу при переході між елементами за допомогою клавіші `Tab`. |
| title | Вказує додаткову текстову підказку |
| translate | Повідомляє браузеру переводити вказаний текст в елементі чи ні. |
| contextmenu | Контекстне меню для елемента |
<script> не підтримує жодних атрибутів подій.
Переглядачі
| Переглядач |  |
 |
 |
 |
 |
 |
|---|---|---|---|---|---|---|
| 1 | 1 | 3 | ≤12.1 | 12 | ≤11 |
| Переглядач |  |
 |
 |
 |
|---|---|---|---|---|
| 4.4 | 18 | 4 | 2 |
Приклади
+ запропонувати свій приклад у пісочниці
Найпростіший приклад використання HTML теґа <script>
See the Pen Script_css_in_ua by css.in.ua (@css_in_ua) on CodePen.
автор: с3сНайпростіший приклад використання HTML теґа <script>
See the Pen Script1_css_in_ua by css.in.ua (@css_in_ua) on CodePen.
автор: с3сРізниця між 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;
}Коментарі
Коментарів ще немає — будьте першим!