addEventListener()
Обновлено: 16.03.2023
Визначення та використання
Метод addEventListener()приєднує обробник події до документа.
Приклади
Додайте подію клацання до документа:
document.addEventListener("click", myFunction);
function myFunction() {
document.getElementById("demo").innerHTML = "Hello World";
}Синтаксис
document.addEventListener(event, function, Capture)
Параметри
| Parameter | Description |
| event | Required. The event name. Do not use the "on" prefix. Use "click" instead of "onclick". All HTML DOM events are listed in the: HTML DOM Event Object Reference. |
| function | Required. The function to run when the event occurs. When the event occurs, an event object is passed to the function as the first parameter. The type of the event object depends on the specified event. For example, the "click" event belongs to the MouseEvent object. |
| capture | Optional (default = false).true - The handler is executed in the capturing phase.false - The handler is executed in the bubbling phase. |
Повернене значення
| NONE |
Більше прикладів
Ви можете додати багато слухачів подій до документа:
document.addEventListener("click", myFunction1);
document.addEventListener("click", myFunction2);Ви можете додавати різні типи подій:
document.addEventListener("mouseover", myFunction);
document.addEventListener("click", someOtherFunction);
document.addEventListener("mouseout", someOtherFunction);Під час передачі параметрів використовуйте «анонімну функцію», щоб викликати функцію з параметрами:
document.addEventListener("click", function() {
myFunction(p1, p2);
});Змініть колір фону документа:
document.addEventListener("click", function(){
document.body.style.backgroundColor = "red";
});