在《javascript高階程式設計》一書的6.3.5:建立和操作節點一節中，介紹了幾種動態建立html節點的方法，其中有以下幾種常見方法：

· crateAttribute(name)：　　　　　 　　用指定名稱name建立特性節點

· createComment(text)：　　　　　　　建立帶文字text的註釋節點

· createDocumentFragment()：　　　　建立文件碎片節點

· createElement(tagname)：　　　　　  建立標籤名為tagname的節點

· createTextNode(text)：　　　　　　   建立包含文字text的文字節點

其中最感興趣且以前沒有接觸過的一個方法是createDocumentFragment()方法，書中介紹說：在更新少量節點的時候可以之間向document.body節點中新增，但是當要向document中新增大量資料是，如果諸葛新增這些新節點，這個過程非常緩慢，因為每新增一個節點都會呼叫父節點的appendChild()方法，為了解決這個問題，可以使用一個文件碎片，把所有的新節點附加其上，然後把文件碎片一次性新增到document中。

加入想建立十個段落，使用常規的方式可能會寫出這樣的程式碼：

當然，這段程式碼執行是沒有問題，但是他呼叫了十次document.body.appendChild()，每次都要產生一次頁面渲染。這時碎片就十分有用了：

在這段程式碼中，每個新的<p />元素都被新增到文件碎片中，然後這個碎片被作為引數傳遞給appendChild()。這裡對appendChild()的呼叫實際上並不是把文件碎片本省追加到body元素中，而是僅僅追加碎片中的子節點，然後可以看到明顯的效能提示，document.body.appenChild()一次替代十次，著一位著只需要進行一個內容渲染重新整理。