事件委托

事件冒泡本身的特性，会带来的坏处，也会带来的好处，需要我们灵活掌握，生活中有如下场景：

班上有100个学生，快递员有100个快递，如果一个个的送花费时间较长。同时每个学生领取的时候，也需要排队领取，也花费时间较长。以如下代码来打个比方：

var ul = document.querySelector('ul');
var li = ul.querySelectorAll('li');

for (var i = 0; i < li.length; i++) {
    li[i].addEventListener('click', function (e) {
        alert(this.innerHTML)
    })
}

当用普通的方式来写的话，需要使用for循环对每一项进行调用。

事件委托

事件委托也称为事件代理，在JQuery里面称为事件委派。

事件委托的原理

不是每个子节点单独设置事件监听器，而是事件监听器设置坐在其父节点上，然后利用冒泡原理影响设置每个子节点。

事件委托的作用

只操作一次DOM，提高程序性能。

var ul = document.querySelector('ul');
ul.addEventListener('click', function (e) {
   alert(e.target.innerHTML)
})

当利用事件委托的原理来写时，每次只会调用一次，减少了对DOM的操作。