事件冒泡和事件捕获

1. DOM事件

DOM级别一共可以分为4个级别：DOM0级，DOM1级，DOM2级和DOM3级，
而DOM事件分为3个级别：DOM0级事件处理，DOM2级事件处理和DOM3级事件处理。

事件：指可以被 JavaScript 侦测到的行为。即鼠标点击、页面或图像载入、鼠标悬浮于页面的某个热点之上、在表单中选取输入框、确认表单、键盘按键等操作。事件通常与函数配合使用，当事件发生时函数才会执行。

事件名称：click/mouseover/blur(“不带on”)

事件处理程序(事件侦听器：**addEventListener**)：响应某个事件的函数。

事件处理程序函数名称：onclick/onmouseove/onblur

2. 事件流

事件流：指从页面中接收事件的顺序,也可理解为事件在页面中传播的顺序。

IE事件流是事件冒泡，Netscape的事件流是事件捕获。

“DOM2级事件”规定的事件流包括三个阶段：事件捕获阶段、处于目标阶段和事件冒泡阶段。首先发生的是事件捕获，为截获事件提供了机会。然后是实际的目标阶段接收到事件被触发。最后的阶段是冒泡阶段可以在这个阶段对事件做出响应。

3. 事件冒泡

冒泡： IE的事件流叫做事件冒泡（event bubbling），即事件开始时由最具体的元素（文档中嵌套层次最深的那个节点）接收，然后逐级向上传播到较为不具体的节点（文档）。即从下到上，从目标触发的元素逐级向上传播，直到window对象。

4. 阻止事件冒泡

给子级加 event.stopPropagation( )
在事件处理函数中返回 false

但是这两种方式是有区别的。return false 不仅阻止了事件往上冒泡，而且阻止了事件本身(默认事件)。event.stopPropagation()则只阻止事件往上冒泡，不阻止事件本身。
event.target==event.currentTarget，让触发事件的元素等于绑定事件的元素，也可以阻止事件冒泡；
阻止默认事件：event.preventDefault( )

5. 事件捕获

捕获： Netscape团队提出了另一种事件流叫做事件捕获。事件捕获的思想是不太具体的节点应该更早接收到事件，而最具体的节点应该最后接收到事件，事件捕获的用意在于在事件到达预定目标之前捕获它。

6. 阻止事件捕获

通过设置addEventListener的第三个参数可以决定事件是否在捕获阶段触发。
stopPropagation()方法既可以阻止事件冒泡，也可以阻止事件捕获，也可以阻止处于目标阶段。
使用DOM3级新增事件stopImmediatePropagation()方法来阻止事件捕获，另外此方法还可以阻止事件冒泡。

element.addEventListener(event, function, useCapture)
 
event：必须。字符串，指定事件名。
	   注意: 不要使用 "on" 前缀。 例如，使用 "click" ,而不是使用 "onclick"。
function：当事件对象会作为第一个参数传入函数。 事件对象的类型取决于特定的事件。例如， "click" 事件属于 		   MouseEvent(鼠标事件) 对象。
useCapture：true - 事件句柄在捕获阶段执行（即在事件捕获阶段调用处理函数）
			false- false- 默认。事件句柄在冒泡阶段执行（即表示在事件冒泡的阶段调用事件处理函数）