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>
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步