共计 703 个字符，预计需要花费 2 分钟才能阅读完成。
在刚学习 JavaScript 的时候我们都用原生 js 写过简单的类似 tab 选项卡功能，如页面上有 5 个元素，点击哪个元素就让该元素的背景颜色变成红色，其他元素变成白色。如图：
<style>
body,div{
margin: 0;
padding: 0;
}
ul{
overflow: hidden;
}
li{
float: left;
padding: 0 15px;
height: 40px;
line-height: 40px;
border: 1px solid #f00;
margin-right: 10px;
list-style-type: none;
}
</style>
<body>
<ul id=”jiaban”>
<li> 我是第 1 个 li</li>
<li> 我是第 2 个 li</li>
<li> 我是第 3 个 li</li>
<li> 我是第 4 个 li</li>
<li> 我是第 5 个 li</li>
</ul>
<script>
window.onload = function (){
var lis = document.getElementById(“jiaban”).getElementsByTagName(“li”);
for(var i = 0, len = lis.length; i < len; i ++){
lis[i].onclick = function (){
// 1、先将其他的 li 的背景颜色设置为白色
for(var j = 0; j < len; j++){
lis[j].style.background = “white”;
}
// 2、再将当前 li(自己) 设置为红色
this.style.background = “red”;
}
}
}
</script>
</body>
我是使用这种排他思想的方式实现，你们是怎么实现的呢？
