首先 从定义来理解 这两个方法： 
appendChild() 方法：可向节点的子节点列表的末尾添加新的子节点。语法：appendChild(newchild) 
insertBefore() 方法：可在已有的子节点前插入一个新的子节点。语法 ：insertBefore(newchild,refchild) 
相同之处：插入子节点 
不同之处：实现原理方法不同。 
　　　　　appendChild方法是在父级节点中的子节点的末尾添加新的节点（相对于父级节点 来说）。 
　　　　 insertBefore 方法 是在已有的节点前添加新的节点（相对于子节点来说的）。 
来看个这个简单的实例：在id为box-con 的末尾添加一个子节点div