事件捕获事件冒泡事件委派

事件捕获/事件冒泡/事件委托

DOM事件流

事件捕获阶段

当事件发生时，事件从DOM树顶层节点，一直传播到目标节点，这个阶段就叫做事件捕获阶段

事件冒泡阶段

当事件发生时，事件从目标节点，一直传播到DOM树顶层节点，这个阶段就叫做事件冒泡阶段

DOM事件流

当事件发生时，事件传播顺序为：事件捕获阶段—>事件目标阶段—>事件冒泡阶段

阻止冒泡和取消默认事件

阻止冒泡

function stopBubble(e){
    if(e && e.stopPropagation){
        e.stopPropagation();
    }else{
        e.cancelBubble = true;
    }
}

取消默认

function stopDefault(e){
	if(e && e.preventDefault){
		e.preventDefault();
    }else{
        e.returnValue = false;
    }
    return false
}

jquery：阻止冒泡和取消默认

js中return false只可以取消默认事件，jquery中可以同时阻止冒泡和取消默认

$(".div1").click(function(){
    return false
})

事件委派

事件委派就是将事件绑定到元素的共同祖先元素上，事件触发时，通过冒泡触发祖先元素的响应函数，这样可以达到绑定一次，多个元素应用的效果，提高了程序的性能；可以通过event对象的target属性来判断是谁触发的事件