事件冒泡 和 事件捕获

事件冒泡 和 事件捕获

• 事件流描述的是从页面中接受事件的顺序。微软（IE）和网景（Netscape）开发团队提出了两个截然相反的事件流概念。IE的事件流是事件冒泡流(event bubbling)，而Netscape的事件流是事件捕获流(event capturing)

事件冒泡：

• 事件按照从最具体的事件目标到最不具体的事件目标(document对象)的顺序触发
• 执行顺序是自下而上的
• 例如：点击了一个文本节点，开始从文本节点查找，当前文本节点没有绑定点击事件，继续向上找，找到父级有绑定的点击事件，执行，再向上找，body，没有绑定点击事件，再到html,document,都没再有绑定的点击事件，好，整个冒泡过程结束。

阻止事件冒泡：

• 一、event.stopPropagation()
• 则只阻止事件往上冒泡，不阻止事件本身

$("#div1").mousedown(function(event){
event.stopPropagation();
});

• 二、return false
• 不仅阻止了事件往上冒泡，而且阻止了事件本身

$("#div1").mousedown(function(event){
return false;
});

事件捕获：

• 事件按照从不大具体的事件目标到具体的事件目标(document对象)的顺序触发
• 执行顺序是自上而下的

addEventListener方法：

• element.addEventListener(event, function, useCapture)
• 第一个参数是需要绑定的事件，第二个参数是触发事件后要执行的函数。而第三个参数默认值是false，表示在事件冒泡的阶段调用事件处理函数，如果参数为true，则表示在事件捕获阶段调用处理函数。