转自：https://developer.mozilla.org/zh-CN/docs/Web/API/Event

 

---

 

 

Event接口表示在DOM中发生的任何事件; 一些是用户生成的（例如鼠标或键盘事件），而其他由API生成(例如指示动画已经完成运行的事件，视频已被暂停等等)。有许多类型的事件，其中一些使用基于主要事件接口的其他接口。事件本身包含所有事件通用的属性和方法。

 

本章介绍了 DOM Event 模型。主要包括 Event 接口本身的描述以及在DOM节点上的事件注册， event listeners ，还有说明各种事件接口如何关联的一些较长的例子。

 

HTML 属性

在属性中的JavaScript 代码，是通过 event 参数传入 Event 对象的。 在HTML规范中，其返回值会以一种特殊的方式被处理。

我们应该避免使用这种方式。因为它会使标记数量变大，而可读性却较差。 内容/结构 和 行为之间没有很好的分离，使得在处理bug时非常困难。

DOM 元素属性

1 // Assuming myButton is a button element2 myButton.onclick = function(event){alert('Hello world');};

该函数在定义时，可以传入一个 event 形式的参数。 在HTML 规范中，其返回值会以一种特殊的方式被处理。

这种方法的问题在于每个元素和事件只能设置一个处理函数。

 

DOM Event 接口

事件处理函数可以附加在各种对象上，包括 DOM元素，window 对象 等。当事件发生时， event 对象就会被创建并依次传递给事件监听器。

在处理函数中，将event对象作为第一个参数参数，可以访问 DOM Event 接口。下面简单的实例则简单说明了 event对象是如何传入事件处理函数，在函数中是如何被使用的。

1 function foo(evt) {2   // the evt parameter is automatically assigned the event object3   alert(evt);4 }5 table_el.onclick = foo;

属性

Event.bubbles

一个布尔值，用来表示该事件是否在DOM中冒泡。

Event.cancelBubble

Event.stopPropagation() 以前的别名。通过在一个事件处理程序返回前设置这个属性的值为真，来阻止事件冒泡。

Event.cancelable

一个布尔值，用来表示这个事件是否可以取消。

Event.composed

一个布尔值，用来表示这个事件是否可以在阴影DOM和常规DOM之间的边界上浮动。

Event.currentTarget

当前注册事件的对象的引用。这是一个这个事件目前需要传递到的对象（译者：大概意思就是注册这个事件监听的对象）。这个值会在传递的途中进行改变。

Event.deepPath 

一个由事件流经过了的 DOM 

Node 组成的 

Array 

Event.defaultPrevented 

一个布尔值，表示了是否已经执行过了

event.preventDefault()（译者：其实应该就是是否已经阻止默认行为）

Event.eventPhase

指示事件流正在处理哪个阶段。

Event.explicitOriginalTarget 

 只读

事件的原始目标（Mozilla内核特定属性）。

Event.originalTarget 

在任何重定向之前,事件的原始目标 （Mozilla内核特定属性）。

Event.returnValue 

一个非标准的替代方案（从旧版本的Microsoft Internet Explorer）到

Event.preventDefault()和

Event.defaultPrevented。

Event.scoped 

一个

Boolean，表示给定的事件是否会通过阴影进入到标准的DOM中。 此属性已重命名为

composed。

Event.srcElement 

非标准别名（Microsoft Internet Explorer的旧版本） 

Event.target.

Event.target

对事件起源目标的引用。

Event.timeStamp

事件创建时的时间戳，毫秒级别。按照规定，这个时间戳是距离某个特定时刻的差值，但实际上在浏览器中此处的事件戳的定义有所不同。另外，正在开展工作将其改为

DOMHighResTimeStamp。（译者注：参考时间戳，在浏览器中此处的时间戳是距离该页面打开时刻的大小）。

Event.type

事件的类型（不区分大小写）。

Event.isTrusted 

指明事件是否是由浏览器（当用户点击实例后）或者由脚本（使用事件的创建方法，例如event.initEvent）启动。

方法

event.initEvent

通过

DocumentEvent的接口给被创建的事件初始化某些值。

event.preventBubble 

已废弃 Gecko 24

防止事件冒泡。已弃用，请使用 

event.stopPropagation 代替它。

event.preventDefault

取消事件（如果该事件可取消）。

event.stopImmediatePropagation

对这个特定的事件而言，没有其他监听器被调用。这个事件既不会添加到相同的元素上，也不会添加到以后将要遍历的元素上（例如在捕获阶段）。

event.stopPropagation

停止事件冒泡。

Event.getPreventDefault() 

未标准化，返回 

Event.defaultPrevented 的值。用 

Event.defaultPrevented 代替。