zoukankan      html  css  js  c++  java
  • jQuery对DOM节点进行操作(删除节点)

    1.定义和用法

      remove():用于从DOM中删除所有匹配的元素,传入的参数用于根据jQuery表达式来筛选元素。

      注意:remove()方法删除某个节点之后,该节点所包含的所有后代节点将同时被删除。该方法的返回值时一个指向已被删除的节点的引用,以后也可以继续使用这些元素。

    <body>
        <script type="text/javascript">
            //入口函数
            $(document).ready(function(){
                // 获取节点
                $jsh1 = $("div h1:first-child")
                // 删除节点
                $jsh1.remove()
            })
        </script>
        <div>
            <h1>hello world</h1>
            <h1>nice</h1>
        </div>
    </body>

      输出:

       detach():和remove()方法一样,也是删除DOM中匹配的元素,但是这个方法不会把匹配的元素从jQuery对象中删除,因此,在将来仍然可以使用这些匹配的元素。与remove()不同的是,所有绑定的时间或附加的数据都会保留下来。

      示例:

    <body>
        <script type="text/javascript">
            //入口函数
            $(document).ready(function(){
                // 获取节点
                $jsh1 = $("div h1:first-child")
                // 删除节点
                $jsh1.detach()
            })
        </script>
        <div>
            <h1>hello world</h1>
            <h1>nice</h1>
        </div>
    </body>

      输出:

      empty():该方法并不是删除节点,而是将节点清空,该方法可以清空元素中的所有的后代节点

      示例:

    <body>
        <script type="text/javascript">
            //入口函数
            $(document).ready(function(){
                // 获取节点
                $jsh1 = $("div h1:first-child")
                // 删除节点子元素
                $jsh1.empty()
            })
        </script>
        <div>
            <h1>hello world</h1>
            <h1>nice</h1>
        </div>
    </body>

      输出:

  • 相关阅读:
    NConsoler 介绍
    HOWTO:批量删除存储过程和表
    HOWTO:使ASP.NET网站Forms验证可以指定多个登录页面
    [架构模式实践]如何不让第三方服务/组件的故障阻碍开发和测试进度
    GDI+学习笔记
    脚印: SD2C 2009 参会小记(非技术篇)
    Expression Web使用问题,相关资源及今日阅读
    HOWTO:FirePHP乱码问题解决
    [ECSHOP挖寶]用戶注銷過程
    励志好文
  • 原文地址:https://www.cnblogs.com/abner-pan/p/12858387.html
Copyright © 2011-2022 走看看