JS代码
let newsBox = document.getElementById("newsBox");
let newsList = newsBox.getElementsByTagName("li");
/*
自定义属性编程思想:
前期把一些值存储到元素的自定义属性上,后期需要用到的时候
直接从属性上获取到这些值即可
*/
for (let i = 0; i < newsList.length; i++) {
let n = newsList[i];
let bg = i % 2 === 0 ? '#ff00ff' : '#ff5500';
n.style.background = bg;
n.myOriginBg = bg;
//循环的时候给每一个li都绑定mouseover/mouseout事件
n.onmouseover = function() {
// this:当前操作的这个li
this.style.background = 'lightblue';
}
n.onmouseout = function() {
this.style.background =this.myOriginBg;
}
}