jQuery删除节点

jQuery中三种删除节点的方法 remove()，detach()，empty()

1、remove()

作用：当某个节点用remove()方法删除后，该节点所包含的所有后代节点将同时被删除，但不会从jQuery对象中删除，因而可以在将来使用这些匹配的元素。之前绑定的事件将消失。

 detach()

作用：当某个节点用detach()方法删除后，该节点所包含的所有后代节点将同时被删除，但不会从jQuery对象中删除，因而可以在将来使用这些匹配的元素。与remove()不同的是，所有绑定事件、附加数据等都会保留下来。

张小窝
王大米

<script type="text/javascript">
    $(function(){
    	$(".one").hover(function(){
    	    $(this).css("color","#FF0000");
    	});
    	
    	$move = $(".one").remove(); 
    //	$move = $(".one").detach();
    	$move.appendTo("body");
    });
</script>

使用remove方法删除class为"one"的p元素，重新追加后，点击文字，颜色不变，绑定事件失效。

使用detach()方法删除class为"one"的p元素，重新追加后，点击文字，颜色变化，绑定事件保留。

2、empty()

严格意义上讲，empty()方法并不是输出节点，而是清空节点，它能清空元素中的所有后代节点。

   
   
苹果
香蕉
荔枝
 

<script type="text/javascript">
    $(function(){
    	$("ul li:eq(1)").empty();
    });
</script>

当代码运行后，第二个<li>元素的内容被清空，只剩下<li>标签默认的符号“ . ”