一个要注意避免的就是事件与DOM元素的紧耦合。比如先看看下面这个代码，考虑到用一个简单表单来接受用户输入的信息。
<form id="msgbox" action="#" method="get">
<label for="msg">your message</label>
<input id="msg" value="" />
<button>SEND</button>
</form>
2.我们能写一段代码让屏幕上显示刚才表单提交的信息
document.getElementById("msgbox").addEventListener("submit", function(e) {
e.preventDefault()
var msg = e.currentTarget.getElementById("msg").value.trim()
if (msg) {
alert(msg)
}
}, false)
那么如果我们想对显示出来的这句话做一些操作，比如发一条tweet，或存储在服务器或者干些其他什么？则有两个选择：
1，对已有的事件处理方法添加代码
这个方案的缺陷就是每当打算测试或者更新后来添加的事件处理方法时变得非常不弹性化，每当更改或者删除一些功能的时候，总会有一大段代码要跟着去修改。
2，为每一个功能都创建事件处理方法
第二个方法很好的解决了前面方法的问题，虽然这个方法可能会一开始麻烦点。毕竟所有的方法代码都要处理重复的消息提取以及验证步骤。
设想假如能够自行触发自定义的"newMessage"事件而无需验证是否有message提交，或假如能监控整个HTML文档或者body这样的标签而不仅仅只是某个表单的节点，能否做到呢？这就是自定义事件要解决的问题了。
自行触发一个自定义事件是很简单的；如下代码就是传递一个name,details以及options到新建的 CustomEvent对象中:
var event = new CustomEvent(
"newMessage",
{
detail: {
message: "Hello World!",
time: new Date(),
},
bubbles: true,
cancelable: true
}
)
这个案例中，"newMessage"是一个自定义事件类型。而第二个参数包含了此对象的三个属性(detail,bubbles,cancelable)。
detail: 包含了自定义事件的具体信息，这里仅仅就包括了一个message与一个time
bubbles: 如果是true，则事件会一直传递给自身的父对象元素，接着父对象也会触发此类事件
cancelable: 如果是true, 事件可以被事件触发元素的 stopPropagation( ) 方法停止
现在，我们需要针对某个特定元素来触发此类事件。
document.getElementById("msgbox").dispatchEvent(event)
自定义事件是不可以了~但是可以模拟一下~比如你三下点击，可以这么去模拟：取一个变量，让它的只为0，当前为没有点击，然后在一个位置上点击一次让它加1，（点击事件很简单了，onclick嘛~）然后当它加到3的时候就触发一个回调函数，这个回调函数你可以跟这个事件封装到一起，然后在这个期间你可以加一个计时器来判断点击的时间，如果大于500毫秒就让刚刚的那个变量重新归零，这样就可以实现模拟三击事件了~不知道我说的思路你能看明白不~不懂再问我吧~
你这个问题全部内容应该是如下吧：在视频播放的时候，能够用on监听事件的触发,如下：player.on('pause',function(){console.log('视频暂停')；})player.on('ended',function(){console.log('视频结束')})这个是什么原理，怎么自定义类似pause、ended的事件，并能够用on监听？麻烦指教相当于来说你要维护一个事件队列。player对象大概有这么些属性{on: func(key, callback),emit: func(key),events: object}events是一个对象，数据结构如下：{pause: [func, func]}调用on函数时，把event的key以及callback添加到events中。调用emit函数表示相应事件触发，根据相应的key从events中获取相应的callback数组，依次执行函数。
