代码改变世界

PHP remove,empty和detach区别

  youxin  阅读(998)  评论(0编辑  收藏  举报

empty:

把所有段落的子元素(包括文本节点)删除

HTML 代码:
<p>Hello, <span>Person</span> <a href="#">and person</a></p>
jQuery 代码:
$("p").empty();
结果:
<p></p>


remove:

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

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

就是说empty保留了自身,而remove则会移除自己

 

detach:

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

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

 

下面着重就detach不移除元素绑定的事件及数据这一特性来举个例子。

复制代码
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <script type="text/javascript" src="jquery-1.11.0.js" ></script>
        <script type="text/javascript">
            $(function() {
                var $div2=$("#div2");
                $div2.data("value", 1);
                $("#detach").on("click", function() {
                    $div2.detach();
                });

                $("#back").on("click", function() {
                    $("#div1").append($div2);
                    console.log($("#div2").data("value"));
                });
            });
        </script>
    </head>
    <body>
        <div id="div1">
            <div id="div2">
                div2
            </div>
            <div id="div3">
                div3
            </div>
        </div>
        <input value="detach" id="detach" type="button" />
        <input value="back" id="back" type="button" />
    </body>
</html>
复制代码

如果将detach改为remove,那么点击back之后,控制台显示为undefined。

注意detach的返回值,返回被detach的元素

var p;
$( "button" ).click(function() {
if ( p ) {
p.appendTo( "body" );
p = null;
} else {
p = $( "p" ).detach();
}
});

参考:http://blog.csdn.net/qinshenxue/article/details/23832221

编辑推荐:
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
阅读排行:
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 单元测试从入门到精通
历史上的今天:
2011-08-01 Using XAMPP for Local WordPress Theme Development
2011-08-01 Visual Studio中最常用的13个快捷键
点击右上角即可分享
微信分享提示