JavaScript-事件委托（事件代理）

今天给自己的知识结构填个坑，再复习下JS的事件代理。

事件代理可以给JS批量生成的DOM元素添加事件，并且还可以提高效率，因为你确实不用给每个DOM节点添加事件监听了。

事件的监听器，是被添加到了它们的父元素上，监听器会分析从新生成的子元素上冒泡上来的事件，并找到是哪个子元素的事件。

现在，有一个ul、li的列表了，，

<ul id="ulId">
  <li id="li-1">li 1</li>
  <li id="li-2">li 2</li>
  <li id="li-3">li 3</li>
  <li id="li-4">li 4</li>
  <li id="li-5">li 5</li>
  <li id="li-6">li 6</li>
</ul>

那么，当每个子元素被点击的时候，会发生不同的事件。而且这些Li的数量是不定的，因为它们是根据后端返回的JSON生成的。

那么这时，你需要把事件监听器放在它们的父容器 ulId 上面。

这时，当子元素被点击的事件，冒泡到父元素Li上的时候，你就可以通过检查事实的target，从而获取真正被点击的节点元素的引用。

看例子截图：

现在大部分JS都会使用jQuery等工具库来处理DOM事件，但对于事件委托的背后原理，我们还是要了解的。

浅谈数据结构 - 字典