简单的选项卡制作(原生JS)

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
    div{
        width: 100px;
        height: 100px;
        background-color: aqua;
        color: white;
        display: none;
    }
</style>
</head>

<body>
<a href="javascript:btn(1)">视频</a>
<a href="javascript:btn(2)">音乐</a>
<a href="javascript:btn(3)">图片</a>
<div>视频</div>
<div>音乐</div>
<div>图片</div>
</body>
</html>
<script>
    var odiv = document.getElementsByTagName("div");
    function btn(index){
        for(var i = 0 ;i<odiv.length;i++){
            odiv[i].style.display = "none";
        }
        odiv[index-1].style.display = "block";
    }

</script>

猜你喜欢

转载自www.cnblogs.com/lsqbk/p/10259016.html