<script>
//1.隔行变色
//获取所有的li元素,判断是奇数行还是偶数行
var list = document.getElementById("list");
var lis = list.getElementsByTagName("li");
for (var i = 0; i < lis.length; i++) {
var li = lis[i];
if (i % 2 == 0) {
//i是偶数,当前是奇数行
li.style.backgroundColor = "pink";
} else {
//i是奇数,当前是偶数行
li.style.backgroundColor = "skyblue";
}
}
//2.高亮显示
//给li注册鼠标经过和鼠标离开事件
for (var i = 0; i < lis.length; i++) {
var li = lis[i];
var bg;
//鼠标经过,高亮显示当前li
li.onmouseover = function() {
bg = this.style.backgroundColor;
this.style.backgroundColor = "yellow";
}
//鼠标离开,还原li之前的颜色
li.onmouseout = function() {
this.style.backgroundColor = bg;
}
}
</script>
隔行变色和高亮显示
猜你喜欢
转载自blog.csdn.net/weixin_42442123/article/details/83624608
今日推荐
周排行