在刚学习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>我是使用这种排他思想的方式实现，你们是怎么实现的呢？
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。