1、定义

事件捕获指的是从document到触发事件的那个节点，即自上而下的去触发事件。

相反的，事件冒泡是自下而上的去触发事件。绑定事件方法的第三个参数，就是控制事件触发顺序是否为事件捕获。

true,事件捕获；false,事件冒泡。默认false,即事件冒泡。e.stopPropagation会阻止冒泡

2、示例

<div id="div1">

　　<div id="div2">元素</div>

</div>

<script>

　　//事件冒泡

　　var div1 = document.getElementById("div1");

　　var div2 = document.getElementById("div2");

　　div2.addEventListener("click", function(e){console.log("孩子事件")}, true);

　　div1.addEventListener("click", function(e){console.log("父亲事件")}, true);

</script>

<script>

　　//事件捕获

　　var div1 = document.getElementById("div1");

　　var div2 = document.getElementById("div2");

　　div2.addEventListener("click", function(e){console.log("孩子事件")}, true);

　　div1.addEventListener("click", function(e){console.log("父亲事件")}, true);

</script>

3、取消冒泡（两种方式）

标准的W3C 方式：e.stopPropagation();这里的stopPropagation是标准的事件对象的一个方法，调用即可

非标准的IE方式:ev.cancelBubble=true; 这里的cancelBubble是 IE事件对象的属性，设为true就可以了

function stopBubble(e) {    //如果提供了事件对象，则这是一个非IE浏览器   if ( e && e.stopPropagation )      //因此它支持W3C的stopPropagation()方法      e.stopPropagation();  else{  //否则，我们需要使用IE的方式来取消事件冒泡    window.event.cancelBubble = true; 　　}} 4、事件冒泡应用（事件委托或称事件代理） 优点：<1>新添加的元素还会有之前的事件<2>减少循环添加事件，性能更好

　　window.onload = function(){

　　　　var oUl = document.getElementById('ull');

　　　　var aLi = document.getElementsByTagName('li');

　　　　oUl.onmouseover = function(ev){

　　　　　　var event = ev||window.event; // 获取event对象

　　　　　　var target = ev.target || ev.srcElement; // 获取触发事件的目标对象

　　　　　　if(target.nodeName.toLowerCase() == 'li'){ //判断目标对象是不是li

　　　　　　　　target.style.background = 'red';

　　　　　　}

　　　　}

　　}