<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>原生js实现tab切换</title>
<style>
ul{
list-style:none
}
li{
float:left;
border:1px solid deeppink;
width:100px;
height:100px;
}
.bgc{
background:deepskyblue;
}
</style>
</head>
<body>
<ul>
<li class="bgc"></li>
<li></li>
<li></li>
<li></li>
</ul>
<script>
var obj=document.getElementsByTagName("li");\
var i=0;len=obj.length;
for(;i<len;i++){
obj[i].οnclick=clickHandle;
}
function clickHandle(){
var j=0;
for(;j<len;j++){
obj[j].removeAttribute("class");
}
this.addAttribute("class","bgc");
}
</script>
</body>
</html>
//==============华丽的分割线========================
$("li").each(function(i,v){
$(v).click(function(i,v){
$(this).addClass("bgc").removeClass("bgc");
})
})