标签：
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>选项卡</title>
<style type="text/css">
div {
width: 200px;
height: 200px;
border: 1px solid #000;
background: #999;
display: none;
}
.btn {
background: #FF0;
}
</style>
<script type="text/javascript">
window.onload=function(){
var oDiv=document.getElementsByTagName("div");
var oBtn=document.getElementsByTagName("input");
for(var i=0;i<oBtn.length;i++){
oBtn[i].index=i;
oBtn[i].onclick=function(){
for(var i=0;i<oBtn.length;i++){
oBtn[i].className="";
oDiv[i].style.display=‘none‘;
}
this.className="btn";
oDiv[this.index].style.display=‘block‘;
}
}
}
</script>
</head>
<body>
<input type="button" value="教育" class="btn" />
<input type="button" value="培训" />
<input type="button" value="出国" />
<input type="button" value="招生" />
<div style="display:block">教育</div>
<div>培训</div>
<div>出国</div>
<div>招生</div>
</body>
</html>
标签：
原文地址：http://www.cnblogs.com/yuqingfamily/p/5072942.html
