js实现事件委托

事件委托的概念：

　　事件委托就是利用事件冒泡，把事件加到父元素或祖先元素上，触发执行效果。

　　事件委托的写法：

　　　　　　　　

btn6.onclick = function(event){
　　event = event || window.event;
　　var target = event.target || event.srcElement;//获取鼠标源
　　if(target.nodeName.toLowerCase() == 'div'){//获取到鼠标源的tag标签，toLowerCase()方法表示把获取到的节点名转换为小写，并判断是否与右侧相等；若相等则执行逍遥的效果
　　　　alert('事件委托');
　　}
}

说明事件委托可以为新添加的DOM元素动态的添加事件

<ul id="list">

<li id="item1" >item1</li>

<li id="item2" >item2</li>

<li id="item3" >item3</li>

</ul>

<script>

var list = document.getElementById("list");
document.addEventListener("click",function(event){
　　 var target = event.target　||　event.srcElement;
 　　if(target.nodeName == "LI"){
 　　　　alert(target.innerHTML);
　　 }
})

// 添加节点
var node=document.createElement("li");
var textnode=document.createTextNode("item4");
node.appendChild(textnode);
list.appendChild(node);

</script>