事件模型

• DOM事件三阶段：

1. window 往事件触发处传播，遇到注册的捕获事件会触发
2. 传播到事件触发处时触发注册的事件
3. 从事件触发处往 window 传播，遇到注册的冒泡事件会触发
   例外：同时注册冒泡和捕获事件时，会按注册的顺序执行

• 标准事件监听elem.addEventListener(type, handler, capture)/elem.removeEventListener(type, handler, capture)
  handler接收保存事件信息的event对象作为参数；
  event.target为触发事件的对象，handler调用上下文this为绑定监听器的对象
  event.preventDefault()：取消事件默认行为
  event.stopPropagation()：阻止事件冒泡/捕获事件，即阻止事件的传递
  event.stopImmediatePropagation()：取消事件传递&阻止该注册目标再去注册别的事件

  第三个参数：可以是布尔值或者对象，布尔值：false-冒泡，true-捕获
  对象：capture，once（boolean）：true-该事件回调调用一次，passive（Boolean）：永远不会调用stopPropagation

• 老版本IE事件监听elem.attachEvent('on'+type, handler)/elem.detachEvent('on'+type, handler)：handler不接收event作为参数，事件信息保存在window.event中，触发事件的对象为event.srcElement，handler执行上下文this为window使用闭包中调用handler.call(elem, event)可模仿标准模型，然后返回闭包，保证了监听器的移除。event.returnValue为false时取消事件默认行为，event.cancleBubble为true时取消时间传播

• 通常利用事件冒泡机制，事件委托处理程序提高程序性能。

事件委托
通俗地讲就是将事件绑定到元素的父元素上，通过event.target去获取目标。
比如一个列表元素，每一个li标签都会触发同一类事件，那么，通常的做法是在每一个li上都绑定一个触发事件，点到那个就完成对应的回调。然而这种做法很浪费内存。
vue中，可以利用冒泡的机制，在其父元素，也就是ul上绑定一个公共事件，传入一个 $event 参数。当点击某个li标签时，可以通过e.target获取目标。

• 节省内存
• 不需要给子节点注销事件