jQuery基础(二)—DOM篇——节点的删除

1、DOM节点删除之empty()的基本用法

<div class="hello"><p>慕课网</p></div>
//通过empty处理
$('.hello').empty()

//结果：<p>慕课网</p>被移除
<div class="hello"></div>

http://js.jirengu.com/kitidilibi/1/

2、DOM节点删除之remove()的有参用法和无参用法

remove会将元素自身移除，同时也会移除元素内部的一切，包括绑定的事件及与该元素相关的jQuery数据。
remove表达式参数：

remove比empty好用的地方就是可以传递一个选择器表达式用来过滤将被移除的匹配元素集合，可以选择性的删除指定的节点

$("p").filter(":contains('3')").remove()

http://js.jirengu.com/lijegiteqi/1/

  //找到所有p元素中，包含了3的元素
  $("p").remove(":contains('3')")

empty方法
严格地讲，empty()方法并不是删除节点，而是清空节点，它能清空元素中的所有后代节点
empty不能删除自己本身这个节点

remove方法
该节点与该节点所包含的所有后代节点将同时被删除
提供传递一个筛选的表达式，删除指定合集中的元素

3、DOM节点删除之保留数据的删除操作detach()

这个方法不会把匹配的元素从jQuery对象中删除，因而可以在将来再使用这些匹配的元素。与remove()不同的是，所有绑定的事件、附加的数据等都会保留下来。
$("div").detach()这一句会移除对象，仅仅是显示效果没有了。但是内存中还是存在的。当你append之后，又重新回到了文档流中。就又显示出来了。
http://js.jirengu.com/suwocipoge/1/

??????

  $("#bt1").click(function() {
        if (!$("p").length) return; //去重??????
        //通过detach方法删除元素
        //只是页面不可见，但是这个节点还是保存在内存中
        //数据与事件都不会丢失
        p = $("p").detach()
    });