添加元素原来还有insertAdjacent这种方法。insertAdjacentHTML(sWhere,html),insertAdjacentText(sWhere,text),insertAdjacentElement(sWhere,element)
这是ie弄出来的 所以ie基本支持，
chrome(47.0.2526.106 m) 对三个方法都支持
测试ff(40.0.3)不支持 insertAdjacentElement方法
sWhere的取值有beforeBegin,beforeEnd,afterBegin,afterEnd
区别如下
<body> <div id="tag">tag</div> <script> var el = document.getElementById("tag");
el.insertAdjacentHTML("beforeBegin", "<div>beforeBegin html</div>")
el.insertAdjacentHTML("beforeEnd", "<div>beforeEnd html</div>")
el.insertAdjacentHTML("afterBegin", "<div>afterBegin html</div>")
el.insertAdjacentHTML("afterEnd", "<div>afterEnd html</div>")
el.insertAdjacentText("beforeBegin", "beforeBegin text")
el.insertAdjacentText("beforeEnd", "beforeEnd text")
el.insertAdjacentText("afterBegin", "afterBegin text")
el.insertAdjacentText("afterEnd", "afterEnd text")
el.insertAdjacentElement(‘beforeBegin‘, document.createElement(‘div‘))
</script>
</body>
运行后结果
<body> <div>beforeBegin html</div> beforeBegin text <div></div> <div id="tag"> afterBegin text <div>afterBegin html</div> tag <div>beforeEnd html</div> beforeEnd text </div> afterEnd text <div>afterEnd html</div> <script> var el = document.getElementById("tag"); el.insertAdjacentHTML("beforeBegin", "<div>beforeBegin html</div>") el.insertAdjacentHTML("beforeEnd", "<div>beforeEnd html</div>") el.insertAdjacentHTML("afterBegin", "<div>afterBegin html</div>") el.insertAdjacentHTML("afterEnd", "<div>afterEnd html</div>") el.insertAdjacentText("beforeBegin", "beforeBegin text") el.insertAdjacentText("beforeEnd", "beforeEnd text") el.insertAdjacentText("afterBegin", "afterBegin text") el.insertAdjacentText("afterEnd", "afterEnd text") el.insertAdjacentElement(‘beforeBegin‘, document.createElement(‘div‘)) </script>
记录javascript insertAdjacet系列方法
原文：http://www.cnblogs.com/xyz327/p/5095404.html