事件捕获、冒泡的工作原理

什么是事件流

事件流是指从页面中接收事件的顺序。也就是说，当一个事件产生时，这个事件的传播过程就是事件流。

什么是事件冒泡?

IE中的事件流叫事件冒泡。事件冒泡是指事件开始时由最具体的元素接收，然后逐级向上传播到较为不具体的节点(文档)。对于HTML来说，当一个元素产生一个事件时，它会把这个事件传递给它的父元素，父元素接收到之后，还要继续传递给它的上一级元素，就这样一直传播到document对象(一些浏览器会传播到window对象)。

在一个对象上触发某类事件（如click）时，如果此对象定义了此事件的处理程序，那么此事件就会调用这个处理程序;如果没有定义此事件处理程序或者事件返回true,那么这个事件会向这个对象的父级对象传播，从里到外，直至它被处理(父级对象所有同类事件都将被激活)，或者它到达了对象层次的最顶层，即document对象(有些浏览器中是window )。

冒泡型事件触发顺序是指从最特定的事件目标(触发事件对象)到最不特定的事件目标对象(document对象)。

JavaScript冒泡机制是指如果某元素定义了事件A，如click 事件，如果触发了事件之后，没有阻止冒泡事件，那么该事件将向父级元素传播，触发父类的click 事件。

什么是事件捕获

事件捕获是指不太具体的元素更早地接收到事件，而最具体的节点最后接收到事件。它们的用意是在事件到达目标之前就捕获它;也就是与冒泡的过程正好相反。以HTML的click事件为例，document对象(DOM0级规范要求从document开始传播，但是现在的浏览器是从window对象开始的)最先接收到click 事件，然后事件沿着DOM树依次向下传播，一直传播到事件的实际目标。

图解

网景（Netscape）公司团队的事件流采用事件捕获方式，而微软（Microsoft）公司的事件流采用事件冒泡方式，W3C对网景公司和微软公司提出的方案进行了中和处理，规定了事件发生后，首先实现事件捕获，但不会对事件进行处理；然后进行到目标阶段，执行当前元素对象的事件处理程序，但它会被看成是冒泡阶段的一部分；最后实现事件的冒泡，逐级对事件进行处理。