DOM《文档片段（DocumentFragment）节点》

概述

• DocumentFragment代表一个文档的片段，本身就是一个完整的DOM树形结构。没有自己的属性和方法，全部继承自Node和ParentNode接口。
• 没有父节点（parentNode返回null），但是可以插入任意数量的子节点。它不属于当前文档，操作此节点要比直接操作DOM树快得多。一般用于构建一个DOM结构，然后插入当前文档。

let ul = document.getElementById('list');
// 创一个文档片段节点
let docFrag = document.createDocumentFragment();
let li = document.createElement('li');
li.textContent = 'Hello World!';
// 将li添加到文档片段节点中
docFrag.append(li);
// 将文档片段追加到ul中
ul.appendChild(docFrag);

• DocumentFragment本身不能被插入当前文档。当它作为appendChild()、insertBefore()、replaceChild()等方法的参数时，是它的所有子节点插入当前文档，而不是它自身。一旦DocumentFragment节点被添加进当前文档，它自身就变成了空节点。
• DocumentFragment节点对象没有自己的属性和方法，全部继承自Node和ParentNode接口。