JavaScript中有一个比较火的技术叫事件委托

前端在面试的时候,有可能就会问到“事件委托”这么一个概念,不要慌,关于事件委托大家可能听的少,觉得这个问题问的很正经,但是,只要你是做前端的,你一定用过事件委托,至少在你碰到的需求中你应该用了。

这篇,我们从两个方面来搞懂它,1、概念(什么是事件委托)。2、好处(事件委托到底给我们带来哪些好处)

一、关于“事件委托”的概念:

什么个意思了,下面我举一个非常清晰的例子来演示一下:

下面是这个例子的DOM结构:

其中用来排除非LI的子元素。这就是事件委托。

二、关于“事件委托”的好处:

事件委托带来的很明显的好处至少有这三个:

1、提高性能

如果有很多个子元素需要使用for循环来绑定事件的话,那么这样的处理方式是比较影响性能的。然而,使用事件委托的方式,HTML不变,将事件只绑定在它们的父元素上就行,这个性能的优化是很明显的。

2、动态添加的子元素也会绑定之前的事件

这个很好理解,如果使用for循环来给子元素添加绑定事件,然后,在添加一个子元素,这个新添加的子元素是不会绑定事件的,因为它没有在之前的循环内。

但是使用事件委托,将事件绑定在它们的父元素上,相当于对它的所有子元素都绑定了这个事件。即使在添加一个子元素,它也会绑定这个事件(无需重新绑定)。

3、代码变的好维护

相对来说,代码变的更加清晰,所有子元素,只需要初始化时绑定一次,之后不管是新增子元素都无需再在元素上绑定事件。

三、写在最后的总结:

关于事件委托,像jQuery等一些库都有封装好的方法,可以拿来即用,非常方便,本篇主要是和大家交流一下什么事件委托及好处。

以上纯属小郑子个人理解,如有不对可以留言交流,谢谢!

版权声明:本站所有作品(图文、音视频)均由用户自行上传分享,仅供网友学习交流,不声明或保证其内容的正确性,如发现本站有涉嫌抄袭侵权/违法违规的内容。请举报,一经查实,本站将立刻删除。

相关推荐