js事件代理

Posted 2020-06-14

事件代理:

html代码:

<ul id="ul1">
<li><a>目标1</a></li>
<li><a>目标2</a></li>
</ul>

js代码:

var ul1=document.getElementById("ul1");
ul2.addEventListener(‘click‘,function(e){
var e=e||window.event;
var target=e.srcElement||e.target;               //srcElmemt这个只支持firefox

alert(target.tagName);

if(target.tagName.toUpperCase()=="A"){     //当点击id为ul1下的a标签将触发该点击事件，统一为id为ul1下的a标签绑定了点击事件，而不需为每一个a标签写一次事件，依赖的是事件的冒泡。
ul2.style.color="green";
};

return false;                                            //防止跳转
},false);