jQuery便利多个相同的class，点击显示隐藏图标，显示及隐藏其下的内容

最新推荐文章于 2024-05-12 03:36:33 发布

刘吉祥

最新推荐文章于 2024-05-12 03:36:33 发布

阅读量4.6k

点赞数

分类专栏： jquery

本文链接：https://blog.csdn.net/luckybuling/article/details/81255612

版权

这里使用了bootstrap

而jQuery的遍历标签 each 和事件hide（）、show（）、toggle();

直接上代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>jQuery便利多个相同的class，点击显示隐藏图标，显示及隐藏其下的内容</title>
    <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css">
    <script type="text/javascript" src="bootstrap/js/jquery.min.js"></script>
    <script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script>
</head>
<body>

<style>
    body{
        background-color: #FFFFFF;
        letter-spacing: 2px;
    }
    .box{
        padding-top: 100px;
        width: 50%;
        margin: 0 auto;
    }

    ul li ul{
        margin: 20px 0 20px 40px;
    }
    .img_sh{
        margin: 20px 0;
    }

    .img_sh img{
        float: left;
        padding-right: 10px;
    }

&l

最低0.47元/天解锁文章

刘吉祥

关注

0
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
jQuery便利多个相同的class，点击显示隐藏图标，显示及隐藏其下的内容

这里使用了bootstrap而jQuery的遍历标签 each 和事件hide（）、show（）、toggle();直接上代码：&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;meta http-equiv="X-UA-Com
复制链接

扫一扫