Jquery显示隐藏代码

JavaScript 发布时间:2023/04/25 阅读量:237 来源:优尚设计
这篇文章主要为大家详细介绍了jQuery实现HTML元素隐藏和显示,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

话不多说,直接上代码

<!DOCTYPE html>
<html>
  <head>
    <title>Jquery显示隐藏代码</title>
  </head>
  <script src="https://cdn.bootcss.com/jquery/2.1.4/jquery.js"></script>
  <script>
    $(function () {
      $("#btn").click(function () {
        $("#content").toggle(), $(this).toggleClass("opened");
      });
    });
  </script>
  <body>
    <button id="btn">隐藏/显示</button>
    <p id="content" style="display: none">
      我们通过不懈的努力,成为客户在信息化领域值得信任和有价值的长期合作伙伴。
    </p>
  </body>
</html>

 

文章标签:
微信
网站定制咨询 网站定制咨询