今天是第一次写稿，还是有那么一丢丢小鸡冻。。。回归正题啦。。。
关于javaScript事件委托不得不说的那些事，为什么要使用事件委托？
我们可以这么说，假设老板要分配一项任务，首先要秘书叫A君来到办公室，任务分配结束后老板要秘书叫B君。。。以此类推。这样严重浪费了老板的时间，降低了工作效率。我们现在可以将这项任务委托秘书，由秘书统一分配给员工。这样工作效率明显提高了很多。由此我们引出了事件委托。
使用事件委托的原因：添加到页面上的事件处理程序数量直接关系到页面整体运行的性能。
函数对象占用内存，内存越多，性能越差。
事先指定所有事件处理程序导致DOM访问次数过多，延迟页面的交互就绪时间。
解决方案：利用事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件。
使用方法：在DOM树尽量最高的层次上添加一个事件处理程序。触发执行效果。
方法一：由于事件目标是一个项，因此可以通过检查id属性决定采取适当操作。
var lists = document.getElementById('lists');
lists.addEventListener('onclick',function(event){
var target = event.target;
switch (target.id){
case "li1":alert("我是第一个li"); break;
case "li2":alert("我是第二个li"); break;
case "li3":alert("我是第三个li"); break;
}
},false);
方法二：父级处理函数包含在页面函数中，选中元素处理函数单独调用页面函数，在该函数中写被选元素的处理程序。（该方法适合给同类的子元素添加相同的效果）
结构：
页面函数（父级元素，事件类型，被选元素，被选元素的处理函数名）{
获取父级的id;
页面处理函数（对父级元素了的子元素进行筛选）;
对父级元素绑定页面处理函数（或事件）；
}
//调用页面函数
页面函数（父级元素，事件类型，被选元素，被选元素处理函数（）{
被选元素事件；}
代码：
function pagefn(parentid,eventType,selector,elementfn){
var parent = document.getElementById(parentid);
console.log(parent)
function handler(event){
var target =event.target;
if(target.id === selector){
elementfn.call(target);
}
}
parent[eventType] = handler;
}
pagefn('lists','onclick','li',function(){
this.style.backgroundColor = 'red';
});
优点：
1.document对象很快就可以访问，可以在页面生命周期任何时点添加事件处理程序；
2. 在页面设置事件处理程序所需时间更少；
3.页面占有的内存更少，提升性能。
适合使用事件委托的事件：click、mousedown、mouseup、keydowm、keyup、keypress。虽然mouseover和mouseout事件也冒泡，但要适当处理它们不容易，而且需经常计算元素位置（当元素从一个元素移到其子节点，或当鼠标移出该元素，都会触发mouseout事件）。
作为前端菜鸟第一次写博客还请大神多指教。