語法
js
createDocumentFragment()
引數
無。
返回值
一個新建立的、空的 DocumentFragment 物件,已準備好插入節點。
用法說明
DocumentFragment 是 DOM Node 物件,它們從不成為主 DOM 樹的一部分。常規的用法是建立文件片段,將元素追加到文件片段中,然後將文件片段追加到 DOM 樹中。在 DOM 樹中,文件片段會被其所有子節點所取代。
由於文件片段是在記憶體中的,並且不屬於主 DOM 樹,因此在一些舊的引擎中,使用文件片段可能會帶來更好的效能。
您也可以使用 DocumentFragment 建構函式來建立一個新的片段。
js
const fragment = new DocumentFragment();
示例
此示例在 DocumentFragment 中建立了一個主要 Web 瀏覽器列表,然後將新的 DOM 子樹新增到文件中以供顯示。
HTML
html
<ul id="ul"></ul>
JavaScript
js
const element = document.getElementById("ul"); // assuming ul exists
const fragment = document.createDocumentFragment();
const browsers = ["Firefox", "Chrome", "Opera", "Safari"];
browsers.forEach((browser) => {
const li = document.createElement("li");
li.textContent = browser;
fragment.appendChild(li);
});
element.appendChild(fragment);
結果
規範
| 規範 |
|---|
| DOM # ref-for-dom-document-createdocumentfragment① |
瀏覽器相容性
載入中…