jq之div hide slow

最新推荐文章于 2023-02-19 21:33:47 发布

无名`

最新推荐文章于 2023-02-19 21:33:47 发布

阅读量176

点赞数

分类专栏： jq java基础前端文章标签： javascript html

本文链接：https://blog.csdn.net/wanggang182007/article/details/122377675

版权

java基础同时被 3 个专栏收录

124 篇文章 0 订阅

订阅专栏

前端

35 篇文章 0 订阅

订阅专栏

20 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>jq之demo</title>
    <!--线上jq库-->
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
    <script>
        $(document).ready(function(){
            $(".ex .hide").click(function () {
                /*隐藏当前的父文本内容*/
                $(this).parents(".ex").hide("slow");
            });
        });
    </script>
    <style type="text/css">
        div.ex
        {
            background-color: #e5eecc;
            padding:7px;
            border:solid 1px #c3c3c3;
        }
    </style>
</head>
<body>
<h3>Goole</h3>
<div class="ex">
    <button class="hide">点我隐藏</button>
    <p>站点名：百度<br/>
    url:https://www.baidu.com/?tn=40020637_10_oem_dg
    </p>
</div>
<h3>w3c</h3>
<div class="ex">
    <button class="hide">点我隐藏</button>
    <p>站点名：b站<br/>
        url:https://www.bilibili.com/
    </p>
</div>
</body>
</html>

无名`

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jq之div hide slow

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jq之demo</title>  <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script> <script>.
复制链接

扫一扫