<style type="text/css">
.content{
width: 100px;
height: 100px;
border: 1px solid red;
display: none;
}
.active{
background-color: green;
}
</style>
var btn = document.getElementsByTagName('button');
var div =document.getElementsByClassName('content');
for(var i=0;i<btn.length;i++){
(function(n){ //如果这里不做成立即执行函数的话直接使用btn[i],这里的i会 变成3原因是形成了闭包
//因为btn[i].onclick=function(){}是一个表达式
btn[n].onclick=function(){
for(var j=0;j<btn.length;j++){
btn[j].className="";
div[j].style.display="none";
}
this.className="active";
div[n].style.display="block";
}
}(i))
}