insertBefore()
语法：
insertBefore(newchild,refchild)
newchild 插入新的节点
refchild 在此节点前插入新节点
<ul id="myList">
<li>Coffee</li>
<li>Tea</li>
</ul>
function myFunction(){
var newItem=document.createElement("LI")
var textnode=document.createTextNode("Water")
newItem.appendChild(textnode)
var list=document.getElementById("myList")
list.insertBefore(newItem,list.childNodes[0]);
}
appendChild()
语法：
appendChild(newchild)
newchild 所添加的节点
<ul id="myList">
<li>Coffee</li>
<li>Tea</li>
</ul>
function myFunction(){
var node=document.createElement("LI");
var textnode=document.createTextNode("Water");
node.appendChild(textnode);
document.getElementById("myList").appendChild(node);
}
js写基础insertAfter()方法
//DOM没有提供insertAfter()方法
function insertAfter(newElement, targetElement){
var parent = targetElement.parentNode;
if (parent.lastChild == targetElement) {
// 如果最后的节点是目标元素，则直接添加。因为默认是最后
parent.appendChild(newElement);
}else {
parent.insertBefore(newElement, targetElement.nextSibling);
//如果不是，则插入在目标元素的下一个兄弟节点 的前面。也就是目标元素的后面
}
}