深入浅析JS中事件委托的原理

  介绍

本篇文章为大家展示了深入浅析JS中事件委托的原理,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。

<强> 1,什么是事件委托?

事件委托就是利用冒泡的原理,将事件加到父元素或祖先元素上,触发执行效果。

例:在文档中绑定点击事件,当点击的对象为按钮btn时,弹框显示按钮btn的值

& lt; body>   & lt;按钮id=癰tn"值=https://www.yisu.com/zixun/"嘿嘿">哈哈> 脚本   窗口。onload=function () {   让btn=. getelementbyid (btn)   文档。onclick=function (e) {//console.log (e。target)   如果(e。target===btn) {   警报(btn.value)   }   }   }>

深入浅析JS中事件委托的原理

<强> 2,事件委托的优点

(1)可以提高JS性能

例:在ul上创建100个,点击每个李都要弹框显示该李的价值

传统写法:在每个李上都绑定alt="深入浅析JS中事件委托的原理">

如图,事件冒泡是从子元素向父元素传递事件,一层一层,事件委托就是利用了冒泡原理,事件捕获是从DOM最高层对象一层一层往子元素传播。

上述内容就是深入浅析JS中事件委托的原理,你们学到知识或技能了吗?如果还想学到更多技能或者丰富自己的知识储备,欢迎关注行业资讯频道。

深入浅析JS中事件委托的原理