• .before()和.insertBefore()实现同样的功能。主要的区别是语法——内容和目标的位置。 对于before()选择表达式在函数前面，内容作为参数，而.insertBefore()刚好相反，内容在方法前面，它将被放在参数里元素的前面

• .after()和.insertAfter() 实现同样的功能。主要的不同是语法——特别是（插入）内容和目标的位置。 对于after()选择表达式在函数的前面，参数是将要插入的内容。对于 .insertAfter(), 刚好相反，内容在方法前面，它将被放在参数里元素的后面

• before、after与insertBefore。insertAfter的除了目标与位置的不同外，后面的不支持多参数处理

注意事项：

• insertAfter将JQuery封装好的元素插入到指定元素的后面，如果元素后面有元素了，那将后面的元素后移，然后将JQuery对象插入；

• insertBefore将JQuery封装好的元素插入到指定元素的前面，如果元素前面有元素了，那将前面的元素前移，然后将JQuery对象插入；

• .prepend()方法将指定元素插入到匹配元素里面作为它的第一个子元素 (如果要作为最后一个子元素插入用.append()).

• .prepend()和.prependTo()实现同样的功能，主要的不同是语法，插入的内容和目标的位置不同

• 对于.prepend() 而言，选择器表达式写在方法的前面，作为待插入内容的容器，将要被插入的内容作为方法的参数

• 而.prependTo() 正好相反，将要被插入的内容写在方法的前面，可以是选择器表达式或动态创建的标记，待插入内容的容器作为参数。

这里总结下内部操作四个方法的区别：

• append()向每个匹配的元素内部追加内容

• prepend()向每个匹配的元素内部前置内容

• appendTo()把所有匹配的元素追加到另一个指定元素的集合中

• prependTo()把所有匹配的元素前置到另一个指定的元素集合中

• before与after都是用来对相对选中元素外部增加相邻的兄弟节点

• 2个方法都是都可以接收HTML字符串，DOM 元素，元素数组，或者jQuery对象，用来插入到集合中每个匹配元素的前面或者后面

• 2个方法都支持多个参数传递after(div1,div2,....) 可以参考右边案例代码

注意点：

• after向元素的后边添加html代码，如果元素后面有元素了，那将后面的元素后移，然后将html代码插入

• before向元素的前边添加html代码，如果元素前面有元素了，那将前面的元素前移，然后将html代码插

append：这个操作与对指定的元素执行原生的appendChild方法，将它们添加到文档中的情况类似。

appendTo：实际上，使用这个方法是颠倒了常规的$(A).append(B)的操作，即不是把B追加到A中，而是把A追加到B中。

wrap 每个人加个爸爸
之前的：
.append 最后面加个兄弟 (结合appendTo()来记)
.prepend 最前面加个兄弟(prependTo()来记)
.before 我的前面加个兄弟(结合insertBefore来记)
.after我的后面加个兄弟(结合insertAfter()来记)
.detach() 隐身
.remove 自杀
.empty 身体被掏空
.clone 复制 （true全复制 false 浅复制，无事件）
.replaceWith 删除并替换节点（结合.replaceAll()来记）

.children() 找儿子

wrap()穿外套，wrapInner()穿内衣！

unwrap是删除父辈div元素

.wrap 每个人加个爸爸
.append 最后面加个兄弟 (结合appendTo()来记)
.prepend 最前面加个兄弟(prependTo()来记)
.before 我的前面加个兄弟(结合insertBefore来记)
.after我的后面加个兄弟(结合insertAfter()来记)
.detach() 隐身
.remove 自杀
.empty 身体被掏空
.clone 复制 （true全复制 false 浅复制，无事件）
.replaceWith 删除并替换节点（结合.replaceAll()来记

each是一个for循环的包装迭代器
each通过回调的方式处理，并且会有2个固定的实参，索引与元素
each回调方法中的this指向当前迭代的dom元素

看一个简单的案例

<ul>
   <li>慕课网</li>
   <li>Aaron</li>
</ul>

开始迭代li，循环2次

$("li").each(function(index, element) {
    index 索引 0,1
    element是对应的li节点 li,li
    this 指向的是li
})

操作：选择所有的li元素，之后把p元素也加入到li的合集中

<ul>
   <li>list item 1</li>
   <li>list item 3</li>
</ul>
<p>新的p元素</p>

处理一：传递选择器

$('li').add('p')

处理二：传递dom元素

$('li').add(document.getElementsByTagName('p')[0])

还有一种方式，就是动态创建P标签加入到合集，然后插入到指定的位置，但是这样就改变元素的本身的排列了

$('li').add('<p>新的p元素</p>').appendTo(目标位置)