addeventlistener js что это — Q&A Хекслет
2026-02-26 18:40 Diff
https://ru.hexlet.io/qna/javascript/questions/addeventlistener-js-chto-eto

Ответы

Метод addEventlistener используется для прослушивания событий на элементах DOM-дерева. Он позволяет назначать функцию обработчика событий, и будет вызываться при возникновении определенного события, например: клик, наведение курсора мыши, нажатие клавиши и прочие. Имеет несколько преимуществ перед использованием свойства onEvent, так как он позволяет назначать несколько обработчиков на одно и то же событие, контролировать всплытие собития, удалять обработчик (в том числе автоматически).

Пример использования addEventListener:

В этом примере мы используем addEventListener для прослушивания события click на кнопке с id="myButton". Когда пользователь кликает на эту кнопку, будет вызвана функция handleClick, которая отображает всплывающее окно с сообщением.

Метод addEventListener позволяет назначить на элемент обработчики событий. С его помощью, можно указать, например, что делать при клике по кнопке или что делать при наборе текста в текстовом поле. В первом параметре указываем тип передаваемого события, во втором - функцию, которая будет срабатывать после события, указанного в первом параметре. В третьем необязательном параметре передаем характеристики объекта (once, capture, passive) или параметр useCapture.

Синтаксис

элемент.addEventListener('тип события', функция, [характеристики объекта]);

или

элемент.addEventListener('тип события', функция, [useCapture]);

Пример

Давайте сделаем так, чтобы при клике на кнопку выводилось сообщение:

Результат: