EventTarget

EventTarget 是一个由可以接收事件的对象实现的接口,并且可以为它们创建侦听器。

Elementdocumentwindow 是最常见的事件目标,但是其他对象也可以是事件目标,比如XMLHttpRequestAudioNodeAudioContext 等等。

许多事件目标(包括元素,文档和 window)还支持通过 on... 属性和属性设置事件处理程序

方法

EventTarget.addEventListener()
在EventTarget上注册特定事件类型的事件处理程序。
EventTarget.removeEventListener()
EventTarget中删除事件侦听器。
EventTarget.dispatchEvent()
将事件分派到此EventTarget。

Mozilla chrome 代码的其他方法

Mozilla扩展,供JS实现的事件目标使用以 实现 on* 属性。另见 WebIDL bindings 绑定。

  • void setEventHandler(DOMString type, EventHandler handler)
  • EventHandler getEventHandler(DOMString type)

示例

EventTarget 的简单实现

var EventTarget = function() {
  this.listeners = {};
};
EventTarget.prototype.listeners = null;
EventTarget.prototype.addEventListener = function(type, callback) {
  if(!(type in this.listeners)) {
    this.listeners[type] = [];
  }
  this.listeners[type].push(callback);
};
EventTarget.prototype.removeEventListener = function(type, callback) {
  if(!(type in this.listeners)) {
    return;
  }
  var stack = this.listeners[type];
  for(var i = 0, l = stack.length; i < l; i++) {
    if(stack[i] === callback){
      stack.splice(i, 1);
      return this.removeEventListener(type, callback);
    }
  }
};
EventTarget.prototype.dispatchEvent = function(event) {
  if(!(event.type in this.listeners)) {
    return;
  }
  var stack = this.listeners[event.type];
  event.target = this;
  for(var i = 0, l = stack.length; i < l; i++) {
      stack[i].call(this, event);
  }
};

规范

规范 状态 注释
DOM
EventTarget
Living Standard No change.
Document Object Model (DOM) Level 3 Events Specification
EventTarget
Obsolete A few parameters are now optional (listener), or accepts the null value (useCapture).
Document Object Model (DOM) Level 2 Events Specification
EventTarget
Obsolete Initial definition.

浏览器兼容性

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 1.0 1.0 (1.7 or earlier) 9.0 7 1.0
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 1.0 1.0 (1) 9.0 6.0 1.0

相关链接

文档标签和贡献者