js做网页选项卡的问题
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <style> .div1 div{ background-color:#9F0; display:none; border:#009 1px solid;height:50px;width:200px;} .active{background:yellow;} </style> </head> <script type="text/javascript"> window.onload=function(){ var a1=document.getElementById("div1"); var a2=a1.getElementsByTagName("input"); var a3=a1.getElementsByTagName("div"); for(var i=0;i<a2.length;i++){ a2[i].index=i; a2[i].onclick=function() { for(var i=0;i<a2.length;i++) { a2[i].className=""; a3[i].style.display="none"; } this.className="active"; a3[this.indexd].style.display="block"; } } alert("aaa"); }
</script> <body> <div class="div1"> <input calss="active" type="button" value="教育" /> <input type="button" value="社会" /> <input type="button" value="经济" /> <input type="button" value="政治" />
<div style="display:block">000</div> <div>111</div> <div>222</div> <div>333</div>
</div> </body> </html>
