个人总结jQuery DOM操作

jQuery DOM操作

1、删除操作
(1)remove()
$("#p").remove(); //删除 id 为 p 的 div 标签
(2)detach()
$("#p").detach(); //删除 id 为 p 的 div 标签
(3)empty()
$("#div3").empty(); //删除 id 为 div3 的节点的所有子节点(框架保留)
总结：remove 方法和 detach 方法的返回值均为被删除的jQuery节点对象，不同的是，前者指保留该对象节点本身，其他绑定的事件及附加的数据等都会被移除。而后者全部保留。empty 方法则是将指定节点的所有子节点删除，本身保留
2、复制节点clone()
KaTeX parse error: Expected 'EOF', got '#' at position 2: (#̲p).clone([true]…(content).replaceAll(selector);
（2）replaceWith()
　　$(selector).repalceWith(content);
两种方法使用时效果相同.
4.内部插入:内部插入是将content插入到selector节点内部，包括内部的头部和尾部。插入后的节点与原节点是父子关系。
（1）append()——将content添加到seletor内部的头部。
（2）appendTo()
（3）prepend()——将content添加到seletor内部的尾部。
（4）prependTo()
总结：(1)(2)相同，(3)(4)相同
5.外部插入： 外部插入是将content插入到selector节点外部，包括selector节点的前面和后面。插入后的节点与原节点是兄弟关系。
（1）after()
（2）insetAfter()
（3）before()
（4）insertBefore()
使用方法与内部插入类似。
6.包裹操作
（1）wrap()
（2）unwrap()
（3）wrapAll()
（4）wrapInner()
总结：(1)(4)的显示效果相同，(1)是添加父节点，(4)是添加子节点。
(1)(3)的显示效果相同，(1)是为每一个元素添加父节点，(3)是为整个元素只添加一个父节点。