首页 > 代码库 > PHP remove,empty和detach区别

PHP remove,empty和detach区别

2024-07-15 08:51:28   225人阅读

empty：

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

HTML 代码:
<p>Hello, <span>Person</span> <a href="http://www.mamicode.com/#">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


联系
我们