• 博客园logo
  • 会员
  • 众包
  • 新闻
  • 博问
  • 闪存
  • 赞助商
  • HarmonyOS
  • Chat2DB
    • 搜索
      所有博客
    • 搜索
      当前博客
  • 写随笔 我的博客 短消息 简洁模式
    用户头像
    我的博客 我的园子 账号设置 会员中心 简洁模式 ... 退出登录
    注册 登录
风拂晚柳
博客园    首页    新随笔    联系   管理    订阅  订阅

jQuery文档操作--empty()和remove()

   empty()

概述

     删除匹配的元素集合中所有的子节点

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
        <script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>
        <script>
            $(document).ready(function() {
                //empty()删除匹配的元素集合中所有的子节点
                $("button").click(function() {
                    $("div").empty();
                });
            });
        </script>
    </head>

    <body>
        <div style="background-color: #FF0000;width: 130px;height: 50px;">
            <ol>
                <li>第一段话</li>
                <li>第二段话</li>
            </ol>
        </div>
        <button>点击</button>
    </body>

</html>

   remove([expr])

概述

     从DOM中删除所有匹配的元素。

     这个方法不会把匹配的元素从jQuery对象中删除,因而可以在将来再使用这些匹配的元素。但除了这个元素本身得以保留之外,其他的比如绑定的事件,附加的数据等都会被移除

参数

    expr  用于筛选元素的jQuery表达式

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
        <script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>
        <script>
            $(document).ready(function() {
                //remove()从DOM中删除所有匹配的元素
                $("button").click(function() {
                    $("div").remove();
                });
            });
        </script>
    </head>

    <body>
        <div style="background-color: #FF0000;width: 130px;height: 50px;">
            <ol>
                <li>第一段话</li>
                <li>第二段话</li>
            </ol>
        </div>
        <button>点击</button>
    </body>

</html>

 

posted @ 2018-12-03 11:54  风拂晚柳  阅读(164)  评论(0)    收藏  举报
刷新页面返回顶部
博客园  ©  2004-2025
浙公网安备 33010602011771号 浙ICP备2021040463号-3