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

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

官方解释:

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

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

代码分析

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

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

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="js/jquery-1.7.2.min.js"></script>
<script>
$(document).ready(function(){
var $div1 = $('.div1')
// 绑定事件
$('.div1').click(function(){
alert(1)
})
// 删除元素
$('#detach').click(function(){
$div1.detach();
})
//重新添加
$('#back').click(function(){
$('#box').append($div1)
})
})
</script>
</head>
<body>
<div id="box">
<div class="div1">aaaaaa</div>
<div class="div2"">bbbbbb</div>
</div>
<input type="button" value="detach" id="detach">
<input type="button" value="back" id="back">
</body>
</html>

了解jQuery的detach()和remove()的更多相关文章

  1. jQuery之empty、remove、detach

    三者都有把元素移除的作用,但细微的差别,造就了它们的使命不同. 最权威的解释当然是jQuery_API咯,下面是API中关于他三儿的部分截取. 一.empty: This method removes ...

  2. 探索jquery方法中empty,remove与detach的区别

    最近一直疑惑此三种方法的具体区别在于何处,随即想弄明白其具体的区别,看了一些说明,也依照官方文档,终于把这三个方法弄明白了,果然功夫不负有心人,继续努力. 上正文,先简单介绍下这三种方法 .empty ...

  3. detach() 与remove()

    detach() 与remove()区别,在于remove()掉后,就没有啦,添加的事件也没有啦,后者还有啊,可以保留的哦,虽然 $("div").click(function() ...

  4. jQuery中detach&&remove&&empty三种方法的区别

    jQuery中empty&&remove&&detach三种方法的区别 empty():移除指定元素内部的所有内容,但不包括它本身 remove():移除指定元素内部的 ...

  5. ♫【jQuery】detach

    Jquery empty() remove() detach() 方法的区别 <!DOCTYPE html> <html> <head> <meta char ...

  6. jquery的.detach()方法

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

  7. detach与remove区别,以及detach保留被删除的元素数据,使用

    detach() 会保留所有绑定的事件.附加的数据,这一点与 remove() 不同. remove掉元素后,元素再也找不回了.但是detach还能找回来,还能保留下来. 实现方式如下代码: < ...

  8. jQuery 文档操作 - remove() 方法

    移除所有 <p> 元素: 定义和用法 remove() 方法移除被选元素,包括所有文本和子节点. 该方法不会把匹配的元素从 jQuery 对象中删除,因而可以在将来再使用这些匹配的元素. ...

  9. jquery中empty()和remove()的区别

    empty 顾名思义,清空方法,但是与删除又有点不一样,因为它只移除了 指定元素中的所有子节点. remove与empty一样,都是移除元素的方法,但是remove会将元素自身移除,同时也会移除元素内 ...

随机推荐

  1. spring boot入门学习---1

    1.maven配置 <?xml version="1.0" encoding="UTF-8"?> <project xmlns="h ...

  2. TCP为什么要三次握手?

    在<计算机网络>一书中其中有提到,三次握手的目的是“为了防止已经失效的连接请求报文段突然又传到服务端,因而产生错误”,这种情况是: 一端(client)A发出去的第一个连接请求报文并没有丢 ...

  3. HIVE的UDF

    HIVE的UDF    新建java工程,导入hive相关包,导入hive相关的lib.    创建类继承UDF    自己编写一个evaluate方法,返回值和参数任意.    为了能让mapred ...

  4. 【leetcode算法-简单】20. 有效的括号

    [题目描述] 给定一个只包括 '(',')','{','}','[',']' 的字符串,判断字符串是否有效. 有效字符串需满足: 左括号必须用相同类型的右括号闭合.左括号必须以正确的顺序闭合.注意空字 ...

  5. hdoj3586 (树形dp)

    题目链接:https://vjudge.net/problem/HDU-3586 题意:一棵边权树,要删掉一些边使得每个叶子结点不能到达树根,且这些边的权值<=上限Max,且边权和小于m,求最小 ...

  6. jenkins持续集成(svn+maven)

    一.初始化环境 1.系统管理->插件管理 安装插件 Maven Integration 2.系统管理->全局工具配置 配置jdk.maven 二.项目配置1.源码配置 (使用之前搭建的sv ...

  7. 剑指offer40:一个整型数组里除了两个数字之外,其他的数字都出现了两次。请写程序找出这两个只出现一次的数字

    1 题目描述 一个整型数组里除了两个数字之外,其他的数字都出现了两次.请写程序找出这两个只出现一次的数字. 2 思路和方法 (1)异或:除了有两个数字只出现了一次,其他数字都出现了两次.异或运算中,任 ...

  8. 用python库openpyxl操作excel,从源excel表中提取信息复制到目标excel表中

    现代生活中,我们很难不与excel表打交道,excel表有着易学易用的优点,只是当表中数据量很大,我们又需要从其他表册中复制粘贴一些数据(比如身份证号)的时候,我们会越来越倦怠,毕竟我们不是机器,没法 ...

  9. Python【函数使用技巧】

    写成“子函数+主函数”的代码结构,也是因为每个不同的功能封装在单独的函数代码中,方便后续修改.增删 import math # 变量key代表循环运行程序的开关 key = 1 # 采集信息的函数 d ...

  10. RBAC授权

    RBAC RBAC使用rbac.authorization.k8s.io API Group 来实现授权决策,允许管理员通过 Kubernetes API 动态配置策略,要启用RBAC,需要在 api ...