jQuery中删除方法empty(),remove()和detach()的区别
empty():清空匹配的元素集合中所有的子节点，自身节点和事件都未被删除。
remove():这个方法不会把匹配的元素从jQuery对象中删除，因而可以在将来再使用这些匹配的元素。但除了这个元素本身得以保留之外，其他的比如绑定的事件，附加的数据等都会被移除。
detach()：这个方法不会把匹配的元素从jQuery对象中删除，因而可以在将来再使用这些匹配的元素。与remove()不同的是，所有绑定的事件、附加的数据等都会保留下来。
举个栗子：
<body>
<div id="div1" style="height: 100px;width: 300px;border: 1px solid black;background: yellow;">
this is some text in the div.
<p id="panel">pppp</p>
<p>two ppppppp</p>
</div>
<button>删除div元素</button>
</body>
empty():清空节点，保留自身。
$('button').click(function () {
$('#div1').empty();
})
效果：
remove():删除被选元素极其子元素。
$('button').click(function () {
$('#div1').remove();
})
效果：
detach()方法同detach,但是可以保留jquery相关的数据和绑定事件。
$('#panel').hover(function () {
$(this).css('color','red');
})
var deleteP = $('#panel').detach();
$('#div1').append(deleteP);
效果：
如果用remove()不会保留数据和绑定事件。
$('#panel').hover(function () {
$(this).css('color','red');
})
var deleteP = $('#panel').remove();
$('#div1').append(deleteP);
效果：p不会改变颜色，hover不起作用
关于追加之后p跑到下边问题：
首先，你通过$("p").detach()把上面的p给“删除/隐藏”了，实际上p还是存在的，只是你看不到了。
然后你又用
$("body").append($("p").detach());
向body中添加元素，这个元素其实还是p。
不是p跑到下面，而是你把p给“复制”了一个并添加到最下面，原来的p给隐藏了。
提示：如需移除元素，但保留数据和事件，请使用 detach() 方法。
提示：如需移除元素及它的数据和事件，请使用 remove() 方法。
提示：如只需从被选元素移除内容，请使用 empty() 方法。
jQuery中删除方法empty(),remove()和detach()的区别的更多相关文章
- jQuery 元素移除empty() remove()与detach()的区别？
@1.empty() 删除匹配元素集合中所有的后代字节点元素: <p>hello<span>world</span></p> $("p&quo ...
- 探索jquery方法中empty,remove与detach的区别
最近一直疑惑此三种方法的具体区别在于何处,随即想弄明白其具体的区别,看了一些说明,也依照官方文档,终于把这三个方法弄明白了,果然功夫不负有心人,继续努力. 上正文,先简单介绍下这三种方法 .empty ...
- 转载JQuery 中empty, remove 和 detach的区别
转载 http://www.cnblogs.com/lisongy/p/4109420.html .empty() 描述: 从DOM中移除集合中匹配元素的所有子节点. 这个方法不接受任何参数. 这个 ...
- jQuery中删除节点方法remove()、detach()、empty()分析
jQuery中提供了三种删除节点的方法:remove().detach().empty(),本文详细分析这三种方法. 最容易区分的是empty(),该方法严格上属于“清空节点”,即删除其子节点,自身并 ...
- JavaScript 中 empty、remove 和 detach的区别
内容 empty.remove 和 detach的区别 jQuery 操作 DOM 之删除节点 方法名 元素所绑定的事件及数据是否也被移除 作用 $(selector).empty() 是 从被选元素 ...
- Jquery中删除元素方法
empty用来删除指定元素的子元素,remove用来删除元素,或者设定细化条件执行删除 语法: empty() remove(expr); empty用来删除指定元素的子元素,remove用来删除元素 ...
- jquery 中remove()与detach()的区别
remove()与detach()方法都是从dom中删除所有的元素 两者的共同之处在于都不会把匹配的元素从jQuery对象中删除. 不同之处在于用remove()删除的元素,除了元素被保留,其他的在这 ...
- jQuery的remove和detach的区别
1.remove([expr]) 概述:从DOM中删除所有匹配的元素. 这个方法不会把匹配的元素从jQuery对象中删除,因而可以在将来再使用这些匹配的元素.但除了这个元素本身得以保留之外,其他的 ...
- 关于Jquery中ajax方法data参数用法的总结
data 发送到服务器的数据.将自动转换为请求字符串格式.GET 请求中将附加在 URL 后.查看 processData 选项说明以禁止此自动转换.必须为 Key/Value 格式.如果为数组,jQ ...
随机推荐
- Hibernate运行原生sql并将查询的结果转化为对象
原生SQL查询执行的控制是通过SQLQuery接口进行的,通过执行Session.createSQLQuery()获取这个接口.下面来描述如何使用这个API进行查询.标量查询(Scalar queri ...
- Mediawiki PlantUML Graphviz 图片 中文 乱码
安装Mediawiki 的 PlantUML Graphviz 插件后,生成图片时,中文成乱码问题. 环境:Ubuntu 16.04 MediaWiki 1.31.1 PHP 7.0.32-0 ...
- (C#)生成指定长度的随机字符串的通用方法
.NET(C#)生成指定长度的随机字符串的通用方法,此方法可以指定字符串的长度,是否包含数字,是否包含符号,是否包含小写字母,是否包含大写字母等, 源码: #region 生成指定长度的随机字符串 / ...
- WPF 开源项目
Modern UI for WPF :http://mui.codeplex.com/ 利用Wpf实现Win8 Modern样式的开源项目wpf toolkit :http://wpftoolkit. ...
- windows下安装hadoop
环境 windows7 64位 JDK环境已经配置好(测试的是jdk1.8.0_191) hadoop体现结构: 下载Hadoop,地址 http://archive.apache.org/dist/ ...
- 时间规划在Optaplanner上的实现
在与诸位交流中,使用较多的生产计划和路线规划场景中,大家最为关注的焦点是关于时间的处理问题.确实,时间这一维度具有一定的特殊性.因为时间是一维的,体现为通过图形表示时,它仅可以通过一条有向直线来表达它 ...
- C# DataTable Lamda GroupBy
static void Main(string[] args) { DataTable dt = new DataTable(); dt.Columns.Add("A"); dt. ...
- 2.NB-IoT及通信协议
NB-IoT 1.什么是NB-IoT? NB-IoT全称窄带物联网(Narrow Band IOT),构建于蜂窝网络,只消耗大约180KHz的带宽,可直接部署于GSM网络.UMTS网络或LTE网络,以 ...
- 如何检查tensorflow环境是否能正常调用GPU
检查keras/tensorflow是否正常调用GPU代码 os.environ["CUDA_DEVICE_ORDER"] = "PCI_BUS_ID" os. ...
- mybatis关于ORM的使用以及设计(三)[参数对象转换为SQL语言]
上节分析了Mapper对象的创建. 在ORM的定义中可以理解为Object->SQLMapper抽象层(这一层并不负责具体的SQL执行.这一层可以理解为SQL代理层) 本节分析以下内容: ①Sq ...