Скрипти в HTML

Стандарт W3C HTML включає підтримку сценаріїв(скриптів) на стороні клієнта. Він визначає, яким чином локально виконувані сценарії можуть бути використані на вебсторінці. Конкретні застосунки на стороні клієнта, такі як веббраузер, можуть підтримувати кілька мов сценаріїв, хоча всі популярні браузери підтримують сценарії на JavaScript. Код сценарію може виконуватися під час завантаження документа, або пізніше.

У HTML5 JavaScript сценарії (скрипти) відіграють значну роль при відтворенні аудіо, відео та графічного вмісту (див. нові можливості HTML5).

JavaScript разом із HTML, CSS та DOM були основою для створення концепції DHTML.

У концепції AJAX клієнтські сценарії мають визначне місце.

Сценарії можуть існувати як окремі файли (js-файли), або бути включеними всередину HTML документу. Безпосередньо в HTML-документі код сценарію можна записати:

до елементу <script>;
всередину інших елементів до відповідних атрибутів внутрішніх подій.

Розташування сценаріїв

Елементи SCRIPT

Елементи <script> можуть виконуватися нуль або більше разів у межах елементів «голови»(<head>) і «тіла»(<body>). Сценарії всередині елементів сценарію обробляються при завантаженні документа.

Внутрішні події

Події відбуваються для різних елементів вебсторінки:

Документи (BODY and FRAMESET)
Форми
Елементи інтерфейсу користувача (гіперпосилання, контрол, картинка)

Код сценарію може бути пов'язаний з подією і елементом шляхом написання коду в HTML атрибуті. Ім'я атрибута має відповідати підтримуваній внутрішній події для елемента (наприклад, «OnLoad»). Сценарій виконується щоразу, коли відбувається подія для цього елемента. Ці сценарії — це в основному JavaScript. Модель подій HTML складається з наступних подій для різних типів елементів:^[1]

Документ
- onUnload
Форма
- onSubmit
- onReset
Документ і UI елементи
- Фокус
  - onFocus
  - onBlur
UI елементи
- Дії з мишкою
  - Рухи
    - onMouseOver
    - onMouseOut
    - onMouseMove
  - Кнопки
    - onClick
    - onDblClick
    - onMouseDown
    - onMouseUp
- Клавіатура
  - onKeyPress
  - onKeyDown
  - onKeyUp
- Інше (TEXT/TEXTAREA)
  - Втрата фокусу із зміною вмісту
    - onChange (також OPTION)
  - Виділення тексту
    - onSelect

Деякі браузери підтримують додаткові атрибути подій (поза стандартом), такі як:

onResize
onMove
onScroll
onAbort

Сценарії в атрибутах HTML елементів

Netscape Navigator підтримував функцію під назвою «JavaScript об'єкти» або «макроси сценаріїв», за допомогою якого код сценарію міг бути включений у значення атрибутів HTML, використовуючи синтаксис, аналогічний синтаксису позначення символьних сутностей. Наприклад, код <img width="&{prompt('Width?')};" src="foo.jpg"> викликає функцію JavaScript prompt(), щоб запитати у користувача, якої ширини має бути картинка.^[2]

Специфікація HTML 4.01^[3] резервує синтаксис для «майбутньої підтримки макросів сценаріїв» в HTML атрибутах, але вони не були включені в більш пізні стандарти і не підтримуються жодним поточним^[коли?] браузером.

Примітки

↑ Scripts in HTML documents. W3C. Архів оригіналу за 22 серпня 2011. Процитовано 21 серпня 2012.
↑ David Flanagan (19 листопада 2001). JavaScript: The Definitive Guide: The Definitive Guide, 4th Edition. O'Reilly Media, Inc. с. 192–. ISBN 978-0-596-00048-6. Архів оригіналу за 14 червня 2013. Процитовано 21 серпня 2012.
↑ Reserved syntax for future script macros. w3.org (англ.). Архів оригіналу за 21 лютого 2017. Процитовано 2 лютого 2017.

[1] Scripts in HTML documents. W3C. Архів оригіналу за 22 серпня 2011. Процитовано 21 серпня 2012.

[Flanagan2001-2] David Flanagan (19 листопада 2001). JavaScript: The Definitive Guide: The Definitive Guide, 4th Edition. O'Reilly Media, Inc. с. 192–. ISBN 978-0-596-00048-6. Архів оригіналу за 14 червня 2013. Процитовано 21 серпня 2012.

[appendix-3] Reserved syntax for future script macros. w3.org (англ.). Архів оригіналу за 21 лютого 2017. Процитовано 2 лютого 2017.

[1]

[2]

[3]