文件:importNode() 方法

Baseline 已廣泛支援

此特性已相當成熟,可在許多裝置和瀏覽器版本上使用。自 ⁨2015 年 7 月⁩以來,各瀏覽器均已提供此特性。

Document 物件的 importNode() 方法用於從另一個文件建立一個 NodeDocumentFragment 的副本,以便稍後插入到當前文件中。

匯入的節點尚未包含在文件樹中。要包含它,您需要呼叫一個插入方法,例如 appendChild()insertBefore(),並傳入一個當前在文件樹中的節點。

document.adoptNode() 不同,原始節點不會從其原始文件中移除。匯入的節點是原始節點的克隆。

語法

js
importNode(externalNode)
importNode(externalNode, deep)

引數

externalNode

要匯入到當前文件中的外部 NodeDocumentFragment

deep 可選

一個布林標誌,其預設值為 false,用於控制是否將 externalNode 的整個 DOM 子樹包含在匯入中。

  • 如果 deep 設定為 true,則會複製 externalNode 及其所有後代節點。
  • 如果 deep 設定為 false,則只匯入 externalNode——新節點沒有子節點。

返回值

匯入文件作用域中複製的 importedNode

注意: importedNodeNode.parentNodenull,因為它尚未被插入到文件樹中!

示例

js
const iframe = document.querySelector("iframe");
const oldNode = iframe.contentWindow.document.getElementById("myNode");
const newNode = document.importNode(oldNode, true);
document.getElementById("container").appendChild(newNode);

注意

在將外部文件的節點插入到當前文件之前,它們應該被

  • 使用 document.importNode() 克隆;或者
  • 使用 document.adoptNode() 採用。

注意: 儘管 Firefox 目前沒有強制執行此規則,但為了提高未來相容性,我們建議您遵守此規則。

有關 Node.ownerDocument 問題的更多資訊,請參閱 W3C DOM FAQ。

規範

規範
DOM
# ref-for-dom-document-importnode①

瀏覽器相容性

另見