上一篇文章介绍<template>元素的时候提到了文档碎片DocumentFragment,这篇文章我们学习下什么是文档碎片,以及文档碎片的使用方式。
碎片的创建很简单,使用document.createDocumentFragment()即可。
// 创建DocumentFragment碎片
var fragment = document.createDocumentFragment();
// 创建HTMLElement对象
var pElement = document.createElement('p');
DocumentFragment接口表示文档的一部分(或一段)。更确切地说,它表示一个或多个邻接的 Document 节点和它们的所有子孙节点。DocumentFragment 节点不属于文档树,继承的 parentNode 属性总是 null。不过它有一种特殊的行为,该行为使得它非常有用,即当请求把一个 DocumentFragment 节点插入文档树时,插入的不是DocumentFragment 自身,而是它的所有子孙节点。这使得 DocumentFragment 成了有用的占位符,暂时存放那些一次插入文档的节点。它还有利于实现文档的剪切、复制和粘贴操作,