开发者学堂课程【jQuery 开发教程：jQuery_ 复制元素、DOM 插入到现有元素外】学习笔记，与课程紧密联系，让用户快速学习知识。
课程地址：https://developer.aliyun.com/learning/course/362/detail/4295
jQuery_ 复制元素、DOM 插入到现有元素外
目录：
一、复制元素方法：clone 方法使用
二、DOM 插入现有元素外：after 方法介绍
三、DOM 插入现有元素外：before 方法介绍
四、DOM 插入现有元素外：insertAfter 方法使用
五、DOM 插入现有元素外：insertBefore 方法使用
一、复制元素
1、clone ()
创建一个匹配的元素集合的深度拷贝副本。
深度拷贝的意思是只单纯拷贝过来使用，保持原来不变，只是应用一份来用，下面代码样式
先创建新的 html 文件，命名为 clone
<! DOCTYPE html >
<html lang ="en”>
<head>
<meta charset ="UTF-8">
<title></title>
//引入jquery
<scriptsrc="http://apps,bdimg.com/libs/jquery-2.1.1./jquery.min.js"></script>
<head>
<body>
<p>haha</p>
<p>haha</p>
<p>haha</p>
<span>我是span</span>
<script>
$(function(){
//选择 span 标签，添加至 p 标签
$(”span”).clone().appendTo($(“p”));
})
执行结果：
二、DOM插入现有元素外
1、after()
在匹配元素集合中的每个元素后面插入参数所指定的内容，作为其兄弟节点。
2、before（）
根据参数设定，在匹配元素的前面插入内容(译者注:外部插入)
3、insertAfter( )
在目标元素后面插入集合中每个匹配的元素(注:插入的元素作为目标元素的兄弟元素)。
4、insertBefore()
在目标元素前面插入集合中每个匹配的元素(注:插入的元素作为目标元素的兄弟元素)。
<! DOCTYPE html >
<html lang ="en”>
<head>
<meta charset ="UTF-8">
<title></title>
<scriptsrc="http://apps,bdimg. . com/libs/jquery-2.1.1./jquery.min.js"></script>
<head>
<body>
<p>haha</p>
<p>haha</p>
<p>haha</p>
<span>我是span</span>
<script>
$(function(){
$(”span”).clone().appendTo($(“p”));
})
$(“p").after("<span>11111111111</span>");
$(“span>222222222</span>").insertArter（$("p"))；
$(“p").before ("<span>span</span>");
$(“<span> 1111111111</span").insertBefore($ ("p"));
在来执行，可以看到和上面的结果是一样的
insertAfter( ) 和 insertBefore() 是并不常用的，after() 和 before（）是一样的，一般会比较常用一些。