insertBefore()和appendChild()节点的添加

之前我们讲解过如何创建新节点。创建的新节点如果想发挥作用，必需添加到DOM（HTML文档）。那么怎么把创建好的节点添加DOM中呢，这就是我们现在要研究的话题。
Javascript提供了两种添加节点的方法：

insertBefore()

insertBefore() 方法可以在指定节点的前面插入新节点。
语法：parentNode.insertBefore(newNode , thisNode)
参数/返回值说明：

例如，在 id="dome" 的节点前面添加节点的语句为：

var ele_div=document.createElement("div");
var thisNode=document.getElementById("demo");
this.parentNode.insertBefore(ele_div , thisNode);

注意：insertBefore() 是当前节点的父节点的一个方法，添加节点时，不但要知道当前节点，还要知道当前节点的父节点。一般情况下，可以通过 thisNode.parentNode 来获取父节点。
举例，在指定节点前面不断增加新节点：

<div id="demo">
    <div id="thisNode">点击这里添加新节点</div>
</div>
<script type="text/javascript">
document.getElementById("thisNode").onclick=function(){
    var ele_div=document.createElement("div");
    var ele_text=document.createTextNode("这是新节点");
    ele_div.appendChild(ele_text);
    this.parentNode.insertBefore(ele_div , this);
}
</script>