<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="css/lx.css">
</head>
<body>
<ul>
<li>111111</li>
<li>111111</li>
<li>111111</li>
<li>111111</li>
</ul>
<script>
var oUl=document.getElementsByTagName('ul')[0];
var oLi=oUl.getElementsByTagName('li');
/*事件委托: 利用冒泡的原理,把事件加到父级,触发执行
1,好处:提高性能;
2,后添加的元素也有事件;
event. 事件源,不管你在什么事件中,我操作的当前元素,就是事件源;
兼容 ie window.event.srcElement 标准的浏览器 event.target
*/
oLi[0].style.background='red';
oUl.onmouseover=function(ev){
var ev=ev || window.event;
var target=ev.target || ev.srcElement;
if(target.nodeName.toLowerCase()=='li'){
target.style.background='red';
}
};
oUl.onmouseout=function(ev){
var ev=ev || window.event;
var target=ev.target || ev.srcElement;
if(target.nodeName.toLowerCase()=='li'){
target.style.background='';
}
}
</script>
</body>
</html>本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。
