js的事件机制总结

js的事件机制包括三个阶段，捕获、目标和冒泡。

1. 事件冒泡
微软提出了名为事件冒泡的事件流。事件冒泡可以形象地比喻为把一颗石头投入水中，泡泡会一直从水底冒出水面。也就是说，事件从最内层的元素开始发生，一直向上传播，直到document对象。

2. 事件捕获
网景提出另一种事件流名为事件捕获与事件冒泡相反，事件从最外层开始发生，直到最具体的元素。

上面的例子在事件捕获的概念下发生click事件的顺序应该是 document -> html -> body -> div -> p

3. W3C事件阶段（event phase）：
   当一个DOM事件被触发的时候，他并不是只在它的起源上触发一次，而是会经历三个不同的阶段。
   简而言之，事件一开始从文档的根节点流向目标对象（捕获阶段），然后在目标对向上被触发（目标阶段），之后再回溯到文档的根节点（冒泡阶段）如图所示（图片来自W3C）：
   
   W3C事件的传递是先捕获（从外到内）-> 目标 -> 冒泡（逆向回流，从内到外），一般情况下我们只在冒泡阶段处理回调，addEventListener有三个参数，第一个是事件类型，第二个是回调处理，第三个就是是否在捕获阶段处理

举例（不考虑IE678）：

　　　　　　　var parent = document.getElementById("mydiv");
            parent.addEventListener("click",function(){
   
                console.log("parent");
            },false);
            var child = document.getElementById("child");
            child.addEventListener("click",function(){