第十六章 事件委托
2021-05-25 本文已影响0人
扶光_
什么是事件委托
事件委托就是利用事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件
可以更加的节约性能 减少了与DOM的交互
<body>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>9</li>
<li>10</li>
</ul>
<script>
var ul = document.getElementsByTagName("ul")[0];
var li = document.getElementsByTagName("li")[0];
//给父级ul绑定事件
ul.addEventListener("mouseover",function(event){
event = event || window.event
target = event.target || event.srcElement
if(target.nodeName.toLowerCase()=="li"){//nodeName 节点名
target.style.background = "pink";
}
},false)
//移出事件
ul.addEventListener("mouseout",function(event){
event = event || window.event
target = event.target || event.srcElement
if(target.nodeName.toLowerCase()=="li"){
target.style.background = "none";
}
},false)
</script>
事件委托案列
