JQuery控制标签(Div)显示或隐藏

实现原理是通过Jquery判断是否存在某个Class,以下是核心源码
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8" />
    <title>控制标签显示与隐藏</title>
</head>
<body>
    <style>
        .tesDisplay {
            display: none;
        }
    </style>
    <button id="btn1">显示/隐藏</button>
    <div id="div1" style="width:200px;height:200px;background-color:blue;"></div>
    <script src="./lib/jquery/dist/jquery.min.js"></script>
    <script>
        $("#btn1").click(function () {
            if ($("#div1").hasClass("tesDisplay")) {
                $("#div1").removeClass("tesDisplay");
            } else {
                $("#div1").addClass("tesDisplay");
            }
        });
    </script>
</body>
</html>
转载请保留http://www.luofenming.com/show.aspx?id=ART2020041800001

评论