事件捕获和冒泡

简单获取三个嵌套的元素用来举例：

① 事件捕获-事件传递的顺序-从父级到子级

② 事件冒泡-事件处理的顺序-从子级到父级

var box = document.getElementsByClassName('box')[0];     //父

var item = document.getElementsByClassName('item')[0];  //儿子

var xm = document.getElementsByClassName('xm')[0];     //孙子

addEvent(box,"click",function(){//这里的事件是调用了我们上回写的函数("事件绑定"里面的)

console.log("点击了box");

// 取消冒泡两种方法：

var evObj = window.event || ev;

evObj.cancelBubble = true;

或：

evObj.stopPropagation();

// 阻止默认事件三种方法：

return false;

或

evObj.preventDefault();

或

evObj.returnValue = false;

});

addEvent(item,"click",function(){

console.log("点击了item");

// var evObj = window.event || ev;

// evObj.cancelBubble = true;

});

addEvent(xm,"click",function(){

console.log("点击了xm");

// var evObj = window.event || ev;

// evObj.cancelBubble = true;

});

备注：根据上面的事件冒泡和捕获的特性，读者可以自己运行代码，将注掉的代码放出来，以便查看结果，分析结果，得出自己的结论。