JS 切换显示

<style>
  #hhh div {    
    200px;
    height:200px;
    background:red;
    display:none;
    }

    #hhh input {
        background-color: white;
    }
    #hhh .active
    {background-color:green;
     
    }
   
</style>



<div id="hhh">

<script >
    window.onload = function () {
        var abtn = $("input")
        var adiv = $("#hhh div");       
        var i = 0;        
        for (i = 0; i < abtn.length; i++)
        {
            abtn[i].index = i;
            abtn[i].onmousemove = function ()
            {
                for (i = 0; i < abtn.length; i++) {
                    abtn[i].className = "";
                    adiv[i].style.display = "none";
                };         
                adiv[this.index].style.display="block";
                this.className = "active";
            }
        }
    };

</script>
<input type="button" class="active" value="小杜" />
<input type="button" value="张旭"/>
<input type="button" value="赵帆"/>
    <div style="display:block">11111</div>
    <div>222222</div>
    <div>33333</div>
 </div>

原文地址:https://www.cnblogs.com/isylar/p/3191103.html