2021-09-06简单选项卡函数思路

li_ding_ding

于 2021-09-06 13:13:09 发布

阅读量50

点赞数

分类专栏： js 函数文章标签： js

本文链接：https://blog.csdn.net/li_ding_ding/article/details/120131979

版权

js 同时被 2 个专栏收录

17 篇文章 0 订阅

订阅专栏

函数

2 篇文章 0 订阅

订阅专栏

在这里插入图片描述

效果图：

在这里插入图片描述

</head>
<body>
    <div class="wrapper">
       <button class="active">主题一</button>
       <button>主题二</button>
       <button>主题三</button>
       <div class="content" style="display:block;">成哥很帅</div>
       <div class="content">是是是</div>
       <div class="content">绝对是</div>

    </div>
<script type="text/javascript" src="html.js"></script>
</body>

*{
margin:0;
padding:0;
}
.wrapper{
margin-left:300px;
}
button{
margin-left:20px;
border:none;
}
.active{
background-color:#acf;
}
.content{
display:none;
width:200px;
height:300px;
background-color:tan;
}

var btn = document.getElementsByTagName(“button”);
var div = document.getElementsByClassName(“content”);

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

li_ding_ding

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
2021-09-06简单选项卡函数思路

效果图： </head><body> <div class="wrapper"> <button class="active">主题一</button> <button>主题二</button> <button>主题三</button> <div class="content" style="displ.
复制链接

扫一扫

专栏目录