有关事件冒泡、事件捕获、阻止默认事件

1、事件冒泡：事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发。通俗来讲就是，就是当设定了多个div的嵌套时；即建立了父子关系，当父div与子div共同加入了onclick事件时，当触发了子div的onclick事件后，子div进行相应的js操作，但是父div的onclick事件同样会被触发。
代码演示如下：

    
        
        
        
        
        
        
            
    
    
        
1
            
2
                
3
            
        
    

效果如图所示：

2、事件捕获：从顶层元素到目标元素或者从目标元素到顶层元素，和事件冒泡是一个相反的过程。事件从最不精确的对象(document 对象)开始触发，然后到最精确(也可以在窗口级别捕获事件，不过必须由开发人员特别指定)。
代码演示如下：

    
        
        
        
        
        
        
                
    
    
        
1
            
2
                
3
            
        
    

效果如图所示：

3、阻止默认事件：
（1）阻止事件冒泡：

function bubble3(){
	// 阻止事件冒泡
	var en = ev || event;
	en.cancleBubble = true;
	alert("我是div3");
}

（2）第三个参数若是true，则表示采用事件捕获，
若是false，则表示采用事件冒泡。

	odiv1.addEventListener("click",function capture(){
		alert("我是div1");
	},true)
	odiv2.addEventListener("click",function capture(){
		alert("我是div2");
	},true)
	odiv3.addEventListener("click",function capture(){
		alert("我是div3");
	},true)

改为：

	odiv1.addEventListener("click",function capture(){
		alert("我是div1");
	},false)
	odiv2.addEventListener("click",function capture(){
		alert("我是div2");
	},false)
	odiv3.addEventListener("click",function capture(){
		alert("我是div3");
	},false)