EventListener - 处理由 EventTarget 对象调度的事件

EventListener 接口表示一个对象，它可以处理由 EventTarget 对象调度的事件。

注意： 由于需要与历史内容兼容， EventListener 接受函数和带有 handleEvent() 属性函数的对象。这显示在下面的实例中。

属性

该接口既不实现也不继承任何属性。

方法

该接口不继承任何方法。

EventListener.handleEvent()

每当发生指定类型的事件时调用的函数。

实例

HTML

<button id="btn">点击这里！</button>

<script>
const buttonElement = document.getElementById('btn');

// 通过提供回调函数为 “click” 事件添加处理程序。每当单击元素时，
// 弹出 “元素被点击！” 的提示。
buttonElement.addEventListener('click', function (event) {
  alert('元素通过该方法被点击！');
});

// 为了兼容性，具有 `handleEvent` 属性的非函数对象被视为与函数本身相同。
buttonElement.addEventListener('click', {
  handleEvent: function (event) {
    alert('元素通过 handleEvent 属性被点击！');
  }
});
</script>

尝试一下 »

规范

规范	状态	备注
DOM EventListener 的定义	现行的标准	没有改变。
Document Object Model (DOM) Level 2 Events Specification EventListener 的定义	已过时	初始定义。

桌面浏览器兼容性

移动浏览器兼容性