DocumentFragment類型也是用得比較少的類型之一，但我們還是有必要介紹下其使用方法，以便在開發過程中遇到了該類型可以查看其使用方法，在所有節點類型中，只有DocumentFragment在文檔中沒有對應的標記。DOM規定文檔片段 ( document fragment)是一種“輕量級"的文檔，可以包含和控制節點，但不會像完整的文檔那樣占用額外的資源。DocumentFragment節點具有下列特征：

◎nodeType的值為11;

◎nodeName的值為"#document-fragment";

◎nodeValue的值為null;

◎parentNode的值為null;

◎子節點可以是Element、Proces singlns truc tion、comment、Text、CDATASection或EntityReference。

雖然不能把文檔片段直接添加到文檔中，但可以將它作為一個“倉庫"來使用，即可以在里面保存將來可能會添加到文檔中的節點。要創建文檔片段，可以使用document.createDocumentFragment()

方法，如下所示：

var fragment=document .createDocumentFragment();

文檔片段繼承了Node的所有方法，通常用于執行那些針對文檔的DOM操作。如果將文檔中的節點添加到文檔片段中，就會從文檔樹中移除該節點，也不會從瀏覽器中再看到該節點。添加到文檔

片段中的新節點同樣也不屬于文檔樹?？梢酝ㄟ^appendChild()或insertBefore()將文檔片段中內容添加到文檔中。在將文檔片段作為參數傳遞給這兩個方法時，實際上只會將文檔片段的所有子節點

添加到相應位置上;文檔片段本身永遠不會成為文檔樹的一部分。來看下面的HTML示例代碼：

假設我們想為這個

元素添加3個列表項。如果逐個地添加列表項，將會導致瀏覽器反復渲染(呈現)新信息。為避免這個問題，可以像下面這樣使用一個文檔片段來保存創建的列表項，然后再

一次性將它們添加到文檔中：

var fragment=document.createDocumentFragment();

var ul=document.getElementByld("myList");

var li=null;

for (var i=0;i<3; i++){

li=document.createElement("li");

li. appendChild( document. createTextNode("Item"+(i+l)));

ragment. appendChild(li);

}

ul. appendChild(fragment);

在這個例子中，我們先創建一個文檔片段并取得了對

元素的引用。然后，通過for循環創建 3個列表項，并通過文本表示它們的順序。為此，需要分別創建

元素、創建文本節點，再把文本

節點添加到

元素。接著使用appendChild()將

元素添加到文檔片段中。循環結束后，再調用appendChild()并傳人文檔片段，將所有列表項添加到

元素中。此時，文檔片段的所有子節點都被刪除并轉移到了

元素中。

本文僅限內部技術人員學習交流,不得作于其他商業用途.希望此文對廣技人員有所幫助。原創文章出自:南昌網站建設公司-百恒網絡http://www.51yjwy.com/website/index.html/如轉載請注明出處!