利用事件委託實現點選li列表
阿新 • • 發佈：2019-01-31
我理解的事件委託就是事件冒泡加事件源，給父類元素繫結事件，來監聽子元素的冒泡事件，並找到是哪個子元素(事件源)的事件
點選事件繫結在ul上
var uls=document.getElementsByTagName('ul')[0];
uls.addEventListener('click',function(e){
var event=e||window.event;
//監聽事件源
var src=event.target||event.srcElement;console.log(src.innerText);
},false)
//單個ul新增點選事件
var lis=document.getElementsByTagName('li');
var licount=lis.length;
for(var i=0;i<licount;i++){
//防閉包
(function(j){lis[i].addEventListener('click',function(){
console.log(j+1);
},false)
}(i))
}
點選的時候，先出現li的點選事件，再實現ul的點選事件
注意事項：
1.給元素ul繫結事件，通過addEventListener為點選事件click新增繫結
2.因為繫結addEventListener的時候預設是冒泡，所以子元素li會向上冒泡
3.通過匿名回撥函式的引數e用來接收事件物件，event.target||event.srcElement獲取事件源