DOM Event: 自定义事件

CustomEvent接口的规范在这里：CustomEvent。

现代的前端框架、库或“Custom Elements”等都需要自定义事件来扩展一个模块的功能。当然这些框架/库可能直接提供一些方便的API，如Polymer：

this.fire('myevent', {message: 'success'}, {bubbles: false});

而下面介绍的是，在不依赖特定框架/库的情况下如何创建及使用自定义事件。

创建自定义事件

为了确保对旧版IE的兼容性，以前通常会使用document.createEvent及initCustomEvent的方式来创建自定义事件。
但更现代的浏览器可以直接使用下面这种方式。

// 创建种类为myevent的自定义事件，并放置数据
let myEvent = new CustomEvent("myevent", {
  detail: {
    doILoveRed: true
  }
});

// 监听myevent事件
obj.addEventListener("myevent", function(event) { 
    console.log(event.detail); // {doILoveRed: true}
});

// 触发事件
obj.dispatchEvent(myEvent);