原理
- 事件的冒泡;通过父元素监听子元素触发的事件。
- DOM的遍历:父元素拥有多个子元素,当一个事件触发,那么就触发了某一类型的元素(拥有相同CLASS)
使用场景
很多商品放在一个ul下面的li标签里面,点击添加或删除商品,就可以绑定商品的父元素ul标签,通过事件代理去找到要点击的商品,完成添加删除事件
为什么要使用
- 绑定事件太多,浏览器占用内存变大,严重影响性能
- Ajax出现,局部刷新盛行,每次加载完,都要重新绑定事件
- 部分浏览器移除元素时,绑定的事件没有被及时移除,导致内存泄漏,严重影响性能
- Ajax中重复绑定,导致代码耦合性过大,影响后期维护
什么时候使用
- 只在必须的时候,比如Ajax局部刷新区域
- 绑定层级比较低的时候,不在body上绑定
- 绑定次数较少的时候,把多个事件绑定合并到一次事件委托中,由这个事件委托的回调,来进行分发
提高事件委托性能
- 降低绑定层级
- 减少绑定次数