zoukankan      html  css  js  c++  java
  • 了解jQuery的detach()和remove()

    jQuery中提供了两种移出一个DOM元素的方法detach()和remove(),虽然是一样的功能,但是给出两种方法,必然有它的不同之处。

    empty() 单独说一下 ,它删除当前元素的所有子元素,包括文本节点,并不会删除当前元素的事件和样式,删除之后不可恢复。

    官方解释:

        detach() 方法移除被选元素,包括所有文本和子节点。detach() 会保留所有绑定的事件、附加的数据

        remove() 方法是移出元素,包括绑定的事件,附加数据

    代码分析

      当使用的是 detach方法时,重新添加元素之后点击事件依然有效

      当使用的是remove方法时,重新添加元素之后点击事件不生效

     1 <!DOCTYPE html>
     2 <html lang="en">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>Document</title>
     6     <script src="js/jquery-1.7.2.min.js"></script>
     7     <script>
     8         $(document).ready(function(){
     9             var $div1 = $('.div1')
    10             // 绑定事件
    11             $('.div1').click(function(){
    12                 alert(1)
    13             })
    14             // 删除元素
    15             $('#detach').click(function(){
    16                 $div1.detach();
    17             })
    18             //重新添加
    19             $('#back').click(function(){
    20                 $('#box').append($div1)
    21             })
    22         })
    23     </script>
    24 </head>
    25 <body>
    26     <div id="box">
    27         <div class="div1">aaaaaa</div>
    28         <div class="div2"">bbbbbb</div>
    29     </div>
    30     <input type="button" value="detach" id="detach">
    31     <input type="button" value="back" id="back">
    32 </body>
    33 </html>
  • 相关阅读:
    MYsql 之单标查询.
    MYSQL社区版安装手册
    爬虫框架学习
    celery_消息队列
    rabbitMQ消息队列
    Django分页设置
    Mysql-基础+安装指南
    super函数的用法
    hashlib 和loggin模块
    Python的魔法方法
  • 原文地址:https://www.cnblogs.com/NTWang/p/6404052.html
Copyright © 2011-2022 走看看