JS-事件委托

利用事件冒泡的特性，将里层的事件委托给外层事件，根据event对象的属性进行事件委托，改善性能。

使用事件委托能够避免对特定的每个节点添加事件监听器；事件监听器是被添加到它们的父元素上。事件监听器会分析从子元素冒泡上来的事件，找到是哪个子元素的事件。

 <!-- HTML -->
<table id="out" border="1" style="cursor: pointer;">
    <tr>
    　　<td>table01</td>
    　　<td>table02</td>
    　　<td>table03</td>
    　　<td>table04</td>
    </tr>
</table>

var out = document.getElementById("out");
    if(out.addEventListener){
        out.addEventListener("click",function(e){
            var e = e||window.event;
            //IE没有e.target，有e.srcElement
            var target = e.target||e.srcElement;
            //判断事件目标是否是td，是的话target即为目标节点td
            if(target.tagName.toLowerCase()=="td"){
                changeStyle(target);
                console.log(target.innerHTML);
            }
        },false);
    }else{
        out.attachEvent("onclick",function(e){
            var e = e||window.event;
            //IE没有e.target，有e.srcElement
            var target = e.target||e.srcElement;
            //判断事件目标是否是td，是的话target即为目标节点td
            if(target.tagName.toLowerCase()=="td"){
                changeStyle(target);
                console.log(target.innerHTML);
            }
        });
    };
};
function changeStyle(ele){
    ele.innerHTML = "已点击"
    ele.style.background="#900";
    ele.style.color = "#fff";
 }