JavaScript DOM操作案例列表的高亮显示
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <style> ul { list-style: none; cursor: pointer; } </style> </head> <body> <ul id="uu"> <li>库你急哇</li> <li>擦浪黑油</li> <li>搜得死内</li> <li>搜嘎</li> <li>他大姨妈</li> </ul> <script src="common.js"></script> <script> //鼠标进入和鼠标离开两个事件 //获取进入的li标签 var list = my$("uu").getElementsByTagName("li"); for (var i = 0; i < list.length; i++) { //为li注册鼠标进入事件 list[i].onmouseover = function () { this.style.backgroundColor = "pink"; }; //为li注册鼠标离开事件 list[i].onmouseout = function () { //恢复到这个标签默认颜色 this.style.backgroundColor = ""; }; } </script> </body> </html>