JavaScript События
События HTML - это "вещи", которые происходят с элементами HTML.
Когда JavaScript используется на HTML страницах, JavaScript может "реагировать" на эти события.
События HTML
HTML-событие может быть чем-то, что делает браузер, или чем-то, что делает пользователь.
Вот несколько примеров HTML-событий:
- Веб-страница в формате HTML завершила загрузку
- Было изменено поле ввода HTML
- Была нажата HTML-кнопка
Часто, когда происходят события, вам может захотеться что-то сделать.
JavaScript позволяет выполнять код при обнаружении событий.
HTML позволяет добавлять атрибуты обработчика событий с помощью кода JavaScript к элементам HTML.
В одинарных кавычках:
<element
event='некоторый JavaScript'>
С двойными кавычками:
<element
event="некоторы JavaScript">
В следующем примере атрибут onclick
(с кодом) добавляется к элементу <button>
:
Пример
<button onclick="document.getElementById('demo').innerHTML = Date()">Время такое?</button>
Попробуйте сами »
В приведенном выше примере код JavaScript изменяет содержимое элемента с id="demo".
В следующем примере код изменяет содержимое своего собственного элемента (используя this.innerHTML
):
Код JavaScript часто состоит из нескольких строк. Более часто можно увидеть атрибуты события, вызывающие функции:
Общие события HTML
Вот список некоторых распространенных HTML-событий:
Событие | Описание |
---|---|
onchange | HTML-элемент был изменен |
onclick | Пользователь нажимает на HTML-элемент |
onmouseover | Пользователь наводит курсор мыши на HTML-элемент |
onmouseout | Пользователь отводит мышь от HTML-элемента |
onkeydown | Пользователь нажимает клавишу клавиатуры |
onload | Браузер завершил загрузку страницы |
Список намного длиннее: Schoolsw3 JavaScript ссылается на события HTML DOM.
Что может сделать JavaScript?
Обработчики событий могут использоваться для обработки и проверки пользовательского ввода, действий пользователя и действий браузера:
- Вещи, которые следует делать каждый раз при загрузке страницы
- Что следует делать, когда страница закрыта
- Действие, которое должно выполняться, когда пользователь нажимает кнопку
- Содержимое, которое должно быть проверено при вводе данных пользователем
- И многое другое...
Для того, чтобы JavaScript мог работать с событиями, можно использовать множество различных методов:
- Атрибуты события HTML могут выполнять код JavaScript напрямую
- Атрибуты события HTML могут вызывать функции JavaScript
- Вы можете назначить свои собственные функции обработчика событий элементам HTML
- Вы можете запретить отправку или обработку событий
- И многое другое...
Вы узнаете гораздо больше о событиях и обработчиках событий в главах HTML DOM.