Tab切换

2018-11-08  本文已影响0人  简奢程序媛

<ul class="btn">

        <li class="cur">1</li>

        <li>2</li>

        <li>3</li>

    </ul>

    <div class="clear"></div>

    <div class="box">

        <div style="display:block">1</div>

        <div>2</div>

        <div>3</div>

    </div>

    <script>

    var btns=document.querySelectorAll('.btn li');

    var boxs=document.querySelectorAll('.box div');

    var curIndex=0;

    for(var i=0;i<btns.length;i++){

        btns[i].index=i;

        btns[i].onclick=function(){

            boxs[this.index].style.display='block';

            boxs[curIndex].style.display='none';

            this.className="cur";

            btns[curIndex].className="";

            curIndex=this.index;

        }

    }

    </script>

上一篇 下一篇

猜你喜欢

热点阅读