zoukankan      html  css  js  c++  java
  • [ jquery 文档处理 empty() remove([expr]) detach([expr]) ] 此方法用于把所有匹配的元素移除

    此方法用于把所有匹配的元素移除:

    remove([expr])

    概述

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

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

     

    empty()

    概述

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

    detach([expr])

    概述

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

    这个方法不会把匹配的元素从jQuery对象中删除,因而可以在将来再使用这些匹配的元素。与remove()不同的是,所有绑定的事件、附加的数据等都会保留下来

    实例:

    <html lang='zh-cn'>
    <head>
    <title>Insert you title</title>
    <meta http-equiv='description' content='this is my page'>
    <meta http-equiv='keywords' content='keyword1,keyword2,keyword3'>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type='text/javascript' src='./js/jquery-1.12.1.min.js'></script>
    <style type="text/css">
        *{margin:0;padding:0;}
        html{font:400 15px/1.2em 'Courier New';color:#666;750px;margin:25px auto;}
        ul{list-style:none;}
        .hover{color:#FF96EC;}
        .wrapAll{color:#FF96EC;}
    </style>
    <script type='text/javascript'>
        $(function(){
          $('.wrap').empty();   //删除子节点(包含文本节点),但是保留元素节点本身
          $('li').remove('.active'); // 从DOM中删除节点,但是不会从jquery对象中将节点删除,但是节点本身的绑定事件,附加的数据呀都会被删除,也就是说只是保留了节点本身
          $('li').detach('.detach'); // 从DOM中删除所有匹配的元素,这个方法不会把匹配的元素从jQuery对象中删除,因而可以在将来再使用这些匹配的元素,与remove()不同的是,所有绑定的事件、附加的数据等都会保留下来
        });
    </script>
    </head>
    <body>
        <div id='demo'>
            <div class='noClassDemo'>
                <ul class='list'>
                    <li>Index value :</li>
                    <li>Index value :</li>
                    <li>Index value :</li>
                    <li>Index value :</li>
                    <li>Index value :</li>
                    <li class='detach'>Index value :</li>
                    <li class='active'>Index</li>
                    <li class='wrap'>Index value :</li>
                    <li>Index value :</li>
                </ul>
                <div>
                    <p class='list'>this is unwrap test</p>
                </div>
            </div>
            <p class='list'>this is unwrap test</p>
        </div>
    </body>
    </html>

     

  • 相关阅读:
    LDAP安装配置(windows)
    chrome postman插件手动安装
    mabatis insert into on duplicate key
    ZOJ 3641 <并查集+STL>
    ZOJ 3633 <rmq 重点在于转化>
    POJ 2817 状态DP 字符串找最多的重复
    POJ 2771 简单二分图匹配
    POJ 1149 最大流<建图> PIGS
    POJ 3692 二分图最大独立点集
    POJ 2239 简单的二分图求最大匹配
  • 原文地址:https://www.cnblogs.com/mysearchblog/p/5618694.html
Copyright © 2011-2022 走看看