您的位置:首页 > 其它

事件冒泡、事件捕获、事件委托初探

2016-04-12 14:08 197 查看
针对这两种情况,W3C在定义dom事件模型的时候,采取了一个折中的方法。在W3C事件模型中,事件的传播顺序应该从事件捕获阶段为始到事件冒泡阶段结束为终。

||/\
-----------------||--||-----------------
|div1|||||
|-------------||--||-----------|
||div2\/||||
|--------------------------------|
|W3C事件模型|
------------------------------------------

原生js实现方式

element.addEventListener("事件类型",“事件处理函数”,“事件顺序”)

事件顺序=true

事件处理函数在捕获阶段执行

事件顺序=false

事件处理函数在冒泡阶段执行

事件委托

什么是事件委托?利用事件冒泡或者事件捕获原理,如果点击div1,div1自身不处理事件,而是将处理任务委托给父级元素或者祖先元素甚至根节点元素来处理。

<divid="divItem"> <divclass="div1"> div1 </div> <divclass="div2"> div2 </div> <divclass="div3"> div3 </div> </div> $("#divItem").delegate('div','click',function(e){ alert($(this).attr('class')) })


                                            
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: