JavaScript中，文檔碎片獨(dú)立于DOM樹之外，存在于內(nèi)存中，創(chuàng)建一個(gè)空白的文檔片段，可以使用createDocumentFragment來創(chuàng)建：
<script?type="text/javascript">
???var?fragment?=?document.createDocumentFragment();????//創(chuàng)建一個(gè)空的文檔片段(可用于做長(zhǎng)褲倉庫)
</script>
對(duì)文檔片段的操作，可以插入、刪除節(jié)點(diǎn) 和 API都和其他DOM元素相同，但是也存在一些不同：
當(dāng)你將文檔樹中的節(jié)點(diǎn)添加到文檔片段中后，就會(huì)從文檔樹中移除該節(jié)點(diǎn)，瀏覽器也不顯示這個(gè)節(jié)點(diǎn)了。文檔樹就沒這個(gè)節(jié)點(diǎn)了 相當(dāng)于移動(dòng)(剪切)
?
可以通過appendChild方法或者 insertBefore方法將文檔片段中的內(nèi)容添加到文檔樹中，反之也可以。
文檔片段永遠(yuǎn)不屬于文檔樹的一部分.
為什么說是DOM優(yōu)化呢? 因?yàn)檫@樣做在某種程度上啊(自己去研究) 可以提高效率
來串代碼把你整的明明白白！
<!DOCTYPE?html>
<html?lang="en">
<head>
????<meta?charset="UTF-8">
????<title>Title</title>
</head>
<body>
<div>
????<p>永遠(yuǎn)的學(xué)生</p>
????<a?href="">永遠(yuǎn)的學(xué)生</a>
</div>
<script?type="text/javascript">
???var?fragment?=?document.createDocumentFragment();????//創(chuàng)建一個(gè)空的文檔片段(可用于做長(zhǎng)褲倉庫)
???var?p_node?=?document.getElementsByTagName('p')[0];??//獲取到p標(biāo)簽節(jié)點(diǎn)
???fragment.appendChild(p_node);??//將p加入到append中?你會(huì)發(fā)現(xiàn)?標(biāo)簽不顯示了
???/*------------吧節(jié)點(diǎn)放出來-----------*/
document.body.appendChild(fragment.children[0]);????????//把它搞回去去?你會(huì)發(fā)現(xiàn)又出現(xiàn)了?在a標(biāo)簽后面
</script>
</body>
</html>
?
By: Bi - Hu
作者：??咸瑜??
APP 