事件委托

事件委托:就是利用事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件

适合用事件委托的事件：click，mousedown，mouseup，keydown，keyup，keypress。

比如我们有100个li，每个li都有相同的click点击事件，可能我们会用for循环的方法，来遍历所有的li，然后给它们添加事件，那这么做会存在什么影响呢？

在JavaScript中，添加到页面上的事件处理程序数量将直接关系到页面的整体运行性能，

因为需要不断的与dom节点进行交互，访问dom的次数越多，

引起浏览器重绘与重排的次数也就越多，就会延长整个页面的交互就绪时间，

这就是为什么性能优化的主要思想之一就是减少DOM操作的原因；

如果要用事件委托，就会将所有的操作放到js程序里面，与dom的操作就只需要交互一次，这样就能大大的减少与dom的交互次数，提高性能；

事件委托影响性能的因素：

• 1：元素中，绑定事件委托的次数；

• 2：点击的最底层元素，到绑定事件元素之间的DOM层数；

结合这三点，在必须使用事件委托的地方，可以如下的处理：

• 1：只在必须的地方，使用事件委托，比如：ajax的局部刷新区域

• 2：尽量的减少绑定的层级，不在body元素上，进行绑定

• 3：减少绑定的次数，如果可以，那么把多个事件的绑定，合并到一次事件委托中去，由这个事件委托的回调，来进行分发。

解决的方案：

• 1：降低层级，这个比较好实现，在开发中，直接把事件绑定在低层级的元素上即可，这个无法继续优化；

• 2：减少绑定的次数，现在只能在这个点上继续优化了。