js事件委托

事件委托也称事件代理，JavaScript高程上讲：事件委托就是利用事件冒泡，指定一个事件处理程序，就可以管理这一类型的所有事件。
举个栗子，我有一个ul标签，下面有很多li标签，每个li标签都需要添加事件，难道我们要获取每个li然后在添加事件吗？ 这样太浪费内存了，也不利于网页性能优化，我们要尽可能减少dom操作，所以我们能不能只给ul添加点击事件，然后利用事件冒泡，这样每个li标签都有事件了，

何为冒泡

我的页面是这样一个结构div > ul >( li >a)*20，即有20个li标签，每个li下面又有一个a标签，如果点击a标签，事件就会向外递进（a->li->ul->div）,依照这个特性，我们是不是可以只给div添加点击事件，当点击a、li时的时候就会冒泡到div，从而执行div的点击事件，这就是事件委托，委托给他们的父辈元素（emmmm不知道我讲清楚了没有~~(>_<)~~）；

实践

var Ul = document.getElementsByTagName("ul")[0];
　　Ul.onclick = function(e){
　　　　var e = e || window.event;
　　　　var target = e.target || e.srcElement;  //srcElement是IE的说法
　　　　if(target.nodeName.toLowerCase() == 'li'){
　　　　　　　  alert(target.innerHTML);
　　　　}
　　}

<ul>
    <li><a>111</a></li>
    <li><a>222</a></li>
    <li><a>333</a></li>
    <li><a>444</a></li>
</ul>

上面代码就是给ul添加一个点击事件，如果被点击的对象nodeName是li，即被点击的是li标签则输出当前li的innerHTML。
最常见的是每个li标签执行的事件不同，这又该怎么解决呢？

我们可以给每个li标签添加类名，或者id，判断当前对象的类名或id，当被操作的li标签是这个类名或id则执行对应的函数，如果不是则不执行这个函数。