jQuery DOM操作简单总结-改

jQuery DOM操作可像SQL操作那样简单分为增、删、改、查。可能这有些牵强，但是能帮助我们理解和记忆。
jQuery DOM操作——改：

一、DOM拷贝

clone()，克隆，深度复制所有匹配的元素集合，包括所有匹配元素、匹配元素的下级元素、文字节点。

$("div").clone()     //只克隆了结构，事件丢失
$("div").clone(true)   //结构、事件与数据都克隆

二、DOM替换

1. .replaceWith()：用提供的内容替换集合中所有匹配的元素并且返回被删除元素的集合

   $("div:eq(1)").replaceWith("<div class='replaceWith'>replaceWith替换第二个div的内容</div>")

   2 . .replaceAll()和.replaceWith()功能类似，但是目标和源相反

   $("<div class='replaceAll'>replaceAll替换第二个div的内容</div>").replaceAll($("div:eq(1)"))

   三、DOM包裹
2. .wrap()，在集合中匹配的每个元素周围包裹一个HTML结构

   $("p").wrap("<div></div>")
   $("p").wrap(function() {
   return "<div><div/>";   //与第一种类似，只是写法不一样
   })

   2 . .unwrap()，作用与wrap方法是相反的。将匹配元素集合的父级元素删除，保留自身（和兄弟、子孙节点，如果存在）在原来的位置。

   $("p").unwarp()
   $("p").unwrap(function() {
    return "<div></div>";    //与第一种类似，只是写法不一样
   })

   3 . .wrapAll()：给集合中匹配的元素增加一个外面包裹HTML结构

   $("p").wrapAll("<div></div>")
   $("p").wrapAll(function() {
    return "<div></div>";    //与第一种类似，只是写法不一样
   })

   4 . .wrapInner()：给集合中匹配的元素的内部，增加包裹的HTML结构

   $("div").wrapInner("<div></div>")
   $("div").wrapInner(function() {
    return "<div></div>";      //与第一种类似，只是写法不一样
   })