接口表示一个没有父级文件的最小文档对象。它被当做一个轻量版的 Document
使用,用于存储已排好版的或尚未打理好格式的XML片段
节点不属于文档树,但是有一个很使用的特点,当把一个 节点插入到文档树中时,插入的不是 自身,而是它所有的子孙节点,这个特性是的 在需要添加大量的dom元素的时候,可以先将dom元素插入 中,然后在插入到页面中,这样就可以大大的减少页面渲染dom元素,提升效率。
例如:循环创建10000个p标签
for (var i = 0; i < 10000; i++) {
var p = document.createElement('p');
p.innerText = i;
document.body.appendChild(p);
}
使用 来执行
var newNode = document.createDocumentFragment()
for (var i = 0; i < 10000; i++) {
var p = document.createElement('p');
p.innerText = i;
newNode.appendChild(p);
}
document.body.appendChild(newNode);
如果使用appendChild方法将原来的dom树中的节点添加到 中时,会删除原来的节点
例如原来页面上有两个节点:
<body>
<h1 id=h1>1</h1>
<h2 id=h2>2</h2>
</body>
向 中插入h1节点后,h1节点就不在页面上显示了