需求：获取原DOM列表中的某个节点复制重新添加进该列表
问题
如果直接添加，只会对获取的节点进行移动，而不是添加
- 利用appendChild()
1,2,3,4 ===> 获取2节点再添加就成了 1,3,4,2；
而不是想要的1,2,3,4,5,2;
解决方法
- createElement()重新创建一个新的节点，并进行设置；
- cloneNode(boolean) 实现节点复制后添加
createElement的话就没有cloneNode一样那么直接去复制，而是一步一步的创造，所以主要讲的是cloneNode方法。
- cloneNode方法
有一个参数（布尔值）
当false时 会复制节点以及其后代节点
为true时 连节点的属性也会一起复制
// html
<div class="parsent">
<a href="" class="child">1</a>
<a href="" class="child">2</a>
<a href="" class="child">3</a>
</div>
// js
var parsent = document.getElementsByClassName('parsent')[0]
var secondChild = parsent.querySelectorAll('a')[1]
var copyChild = secondChild.childNode(true)
parsent.appendChild(copyChild)
添加后的html
<div class="parsent">
<a href="" class="child">1</a>
<a href="" class="child">2</a>
<a href="" class="child">3</a>
<a href="" class="child">2</a>
</div>
如果直接用一个新变量来储存抽离出来的DOM节点，这样做是没用的，结果会是如下
// js
var parsent = document.getElementsByClassName('parsent')[0]
var secondChild = parsent.querySelectorAll('a')[1]
var copyChild = secondChild
parsent.appendChild(copyChild)
// html
<div class="parsent">
<a href="" class="child">1</a>
<a href="" class="child">3</a>
<a href="" class="child">2</a> <!--只进行了移动-->
</div>
