事件冒泡和事件捕获

1.事件冒泡

obj.addEventListener(event,fn,useCapture);

useCapture:为false是事件冒泡；为true为事件捕获

2.ie兼容问题

给元素添加事件:attachEvent（“on”+type，fn）、addEventListener

给元素删除事件：detachEvent（“on”+type,fn）、removeEventListener

获取事件源对象：ev、window.event      (target和srcElement)

阻止事件冒泡：stoppropagation 、cancelBublue

阻止默认行为：preventDefault

补充： stopPropagation()方法既可以阻止事件冒泡，也可以阻止事件捕获，也可以阻止处于目标阶段。

用DOM3级新增事件stopImmediatePropagation()方法来阻止事件捕获，另外此方法还可以阻止事件冒泡。

3、DOM事件流被分为事件捕获阶段 目标阶段 冒泡阶段

案例：遮罩层点击的时候可能会触碰下层的事件

mouseover和mouseout会涉及冒泡事件；mouseenter和mouseleave事件不冒泡。（dom3鼠标事件共9个）

补充：事件代理即事件委托的知识，其实事件委托的原理就是事件冒泡，将子元素的事件绑定到父元素上监听，使用事件代理的好处是可以提高性能

监听原理：

　　document.getElementById("div").addEventListener("click",fuction(e){

　　　//e.target 被点击的元素

　　　　//e.target.nodeName 可操作性判断条件，节点名称 ；className。。。

　　　})

 

转载于:https://www.cnblogs.com/QIQIZAIXIAN/p/7204428.html