Document.importNode()

在此页

句法
范例
注意事项
规范
浏览器兼容性
另请参阅
相关话题

Document 对象的 importNode() method creates a copy of a 节点 or DocumentFragment from another document, to be inserted into the current document later.

The imported node is not yet included in the document tree. To include it, you need to call an insertion method such as appendChild() or insertBefore() with a node that is currently in the document tree.

不像 document.adoptNode() , the original node is not removed from its original document. The imported node is a clone of the original.

句法

const importedNode = document.importNode(externalNode [, deep]);

参数

externalNode

The external


									节点


									DocumentFragment

to import into the current document.

deep 可选

A Boolean which controls whether to include the entire DOM subtree of the


								
									externalNode

in the import.

若 deep 被设为 true ，那么 externalNode and all of its descendants are copied.
若 deep 被设为 false , then only externalNode is imported — the new node has no children.

注意： In the DOM4 specification, deep was an optional argument with a default value of true .

This default has changed in the latest spec! The new default value is false .

Best Practice: Though it's still an optional argument, you should always provide the deep argument for backward and forward compatibility.

With Gecko 28.0 (Firefox 28 / Thunderbird 28 / SeaMonkey 2.25 / Firefox OS 1.3), the console warns developers not to omit the argument.
Starting with Gecko 29.0 (Firefox 29 / Thunderbird 29 / SeaMonkey 2.26)), a shallow clone is defaulted instead of a deep clone.

返回值

The copied importedNode in the scope of the importing document.

注意： importedNode 's Node.parentNode is null , since it has not yet been inserted into the document tree!

范例

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

注意事项

Before they can be inserted into the current document, nodes from external documents should either be:

cloned using document.importNode() ; or
adopted using document.adoptNode() .

Best Practice: Although Firefox doesn't currently enforce this rule, we encourage you to follow this rule for improved future compatibility.

For more on the Node.ownerDocument issues, see the W3C DOM FAQ.

规范

规范	状态	注释
DOM The definition of 'document.importNode()' in that specification.	实时标准
DOM (文档对象模型) 级别 2 核心规范 The definition of 'document.importNode()' in that specification.	过时	初始定义

浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. 更新 GitHub 上的兼容性数据

	桌面						移动
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`importNode`	Chrome 1	Edge 12	Firefox 4	IE 9	Opera 9	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android 4	Opera Android 10.1	Safari iOS Yes	Samsung Internet Android Yes
`deep` parameter optional	Chrome Yes	Edge ≤18	Firefox 10	IE No	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android 10	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes

图例

完整支持
不支持

另请参阅

document.adoptNode() , which behaves very similar to this method
Node.appendChild()
Node.insertBefore()

元数据

最后修改： Jan 26, 2020

在此页

句法

参数

返回值

范例

注意事项

规范

浏览器兼容性

图例

另请参阅

相关话题