jss的事件处理机制
- 事件流：指从页面中接收事件的顺序，有冒泡流和捕获流。
- DOM2级事件规定事件流包括三个阶段：事件捕获阶段、处于目标阶段、事件冒泡阶段。首先发生的是事件捕获，然后是实际的目标接收道事件，最后是冒泡阶段，可以在这个阶段对事件做出响应。
事件监听
addEventListener(事件类型，响应函数，true/false),true代表事件捕获，false代表事件冒泡。
- html
<div id="outer">i am outer!<div id="inner">i am inner!</div>
</div>
复制代码- js
document.getElementById("outer").addEventListener("click",function(){console.log(this.innerText);
},false);
document.getElementById("inner").addEventListener("click",function(){console.log(this.innerText);
},false);//i am inner!
//i am outer! i am inner!
复制代码当为false时，采取冒泡模式，事件流从点击事件开始，往上冒泡触发，此时点击inner，依次弹出inner! outer!
当为true时，采取捕获模式，时间流从最外层节点开始，依次往里捕获，此时点击inner，依次显示outer! inner!
考虑到IE浏览器只支持冒泡模式，所以一般选择冒泡模式。
事件委托
因为冒泡机制，比如既然点击子元素，也会触发父元素的点击事件，那我们完全可以将子元素的事件要做的事写到父元素的事件里，也就是将子元素的事件处理程序写到父元素的事件处理程序中，这就是事件委托；利用事件委托，只指定一个事件处理程序，就可以管理某一个类型的所有事件；
用事件委托的方式，新添加的子元素是带有事件效果的，我们可以发现，当用事件委托的时候，根本就不需要去遍历元素的子节点，只需要给父级元素添加事件就好了，其他的都是在js里面的执行，这样可以大大的减少dom操作，这才是事件委托的精髓所在。
