Javascript 没有jquery的DOM注入

我想知道如何使用DOM注入注入HTML标记，而不使用jquery库

---

我们想从一个外部javascript文件生成几个对象到原始页面，但我们不想依赖于jquery（因为它有90kb），而且我们无法控制将使用我们脚本的站点。

您只是在寻找：

newNode = document.createElement(tagType);

及

有关

文档

级别功能的更多信息，请参阅

有关操作元素的方法，请参见

 object.innerHTML = "<br/><span>Text</span>"

---

这两种方法都有效。

如果要创建许多元素，并且它们包含在一个公共根节点中，我建议创建一个

documentFragment

，并通过

createElement（）

和

appendChild（）

方法将需要生成的所有节点追加到其中

然后只需将

documentFragment

附加到文档中即可

从MDN参考：

由于文档片段位于内存中，而不是主DOM树的一部分，因此向其添加子元素不会导致页面回流（元素位置和几何体的计算）。因此，使用文档片段通常会获得更好的性能

---

你想在加载时间还是以后再注入它们？这是个好问题。我看到太多的问题都写着卡斯佩林的名字。我从谷歌来到这里，得到了我的答案。使用

innerHTML

并不是很好的练习！每次使用

appendChild

（如果可能）！见：

 object.innerHTML = "<br/><span>Text</span>"

 var child = element.appendChild(child);