DOM事件委托

事件委托

把事件绑定在父元素上，监听子元素，也就是委托老爸监视孩子，优点：

• 省监听数（内存）：孩子太多统一让老爸监听
• 可以监听动态元素：孩子没出生委托老爸监听

// 返回鼠标所点击列表内的内容
<ul>
    <li>1</li>
    <li>2</li>
</ul>
<script type="text/javascript">
var ul = document.getElementsByTagName('ul')[0];
ul.onclick = function(e) {
    var event = e;
    var target = event.target;
    console.log(target.innerText);
} 
</script>

• target 与 currentTarget 的区别：
  • e.target: 用户操作的元素
  • e.currentTarget: 程序员监听的元素
  • 比如上例中，e.target 就是 li ，e.currentTarget 就是 ul