事件委托

  最近刷Zepto视频时，听到里面提到了事件委托，就去查了一下，对事件委托有了些了解，特总结一下。

什么是事件委托

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

为什么要用事件委托

• 在数量少的情况下，我们为同一个标签（比如 li ）添加事件时常使用for循环，但是数量多的时候可能会影响浪费内存，甚至对页面性能产生影响。
• 我们在绑定事件时（比如点击事件），只能绑定在页面已有的元素上，而对于新创建的元素便没有这个事件，如果想让新添加的同样具有，这里就得用事件委托。

事件委托的原理

  上面已经说过，事件委托是利用事件的冒泡原理来实现的。
  那么什么是事件冒泡呢？
  事件冒泡就是事件从最深的节点开始，然后逐步向上传播事件。
  给大家举个我查资料时看到的一个例子，说的很形象：
  页面上有这么一个节点树，div>ul>li>a;比如给最里面的a加一个click点击事件，那么这个事件就会一层一层的往外执行，执行顺序a>li>ul>div，有这样一个机制，那么我们给最外面的div加点击事件，那么里面的ul，li，a做点击事件的时候，都会冒泡到最外层的div上，所以都会触发，这就是事件委托，委托它们父级代为执行事件。

适用场合

• 为DOM中的很多元素绑定相同事件时；
• 为DOM中尚不存在的元素绑定事件时；

事件委托的好处

  对于新创建的元素直接就可以拥有想给它添上的事件。

附上相关代码大家可以敲敲试试：

$('#box').on("click",'.a',function(){
      alert('a事件');     
 });
$('#box').append('<div class="a">我是新添加的div</div>');