原生js写tab选项卡

html、css部分

<div id="div1">    <input class="active" type="button" value="1">    <input type="button" value="2">    <input type="button" value="3">    <div style="display:block">11111</div>    <div>22222</div>    <div>33333</div></div><style>#div1 div{ width:200px; height:200px; border:1px #000 solid; display:none;}.active{ background:red;}</style>

js部分

window.onload = function(){    var div1 = document.getElementById("div1");    var input = div1.getElementsByTagName("input");    var div = div1.getElementsByTagName("div");    for(var i=0; i<input.length; i++){        input[i].index = i;        input[i].onclick=function(){            for(var z=0; z<input.length; z++){                input[z].className = "";                div[z].style.display = "none";            }            this.className = "active";            div[this.index].style.display = "block";        }           }   }

效果图