1. 開発者向けのウェブ技術
  2. Web API
  3. Document
  4. importNode()

このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

Document: importNode() メソッド

Baseline 広く利用可能

この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2015年7月以降、すべてのブラウザーで利用可能です。

Document オブジェクトの importNode() メソッドは、後で現在の文書に挿入するために、他の文書から Node または DocumentFragment の複製を作成します。

インポートされたノードは、まだ文書ツリーには含まれません。これを含めるには、 appendChild() や insertBefore() のような挿入メソッドを、現在の文書ツリーに存在するノードに対して呼び出す必要があります。

document.adoptNode() とは異なり、元の文書から元のノードは削除されません。インポートされたノードは元のノードの複製です。

構文

js
importNode(externalNode)
importNode(externalNode, deep)

引数

externalNode

現在の文書にインポートする、外部の Node または DocumentFragment です。

deep 省略可

論理値のフラグで、既定値は false であり、externalNode の DOM サブツリー全体をインポートするかどうかを制御します。

  • deep が true に設定された場合、 externalNode およびその子孫全てが複製されます。
  • deep が false に設定された場合、 externalNode のみがインポートされます — 新しいノードには子ノードはない状態になります。

返値

インポートする側の文書のスコープにコピーされた importedNode です。

メモ: importedNode の Node.parentNode は null になります。まだ文書ツリーに挿入されていないからです。

例

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

メモ

外部文書からのノードは、現在の文書に挿入する前に、次のいずれかの状態にしなければなりません。

メモ: Firefox は今のところこのルールを強制していませんが、将来の互換性を改善するために、このルールに従うことを強く推奨します。

Node.ownerDocument の問題に関して詳しくは、W3C DOM FAQ を参照してください。

仕様書

仕様書
DOM
# ref-for-dom-document-importnode①

ブラウザーの互換性

関連情報

MDN の改良に協力

協力方法を知る

このページは MDN の貢献者によって に最終更新されました。

GitHub でこのページを表示 • このコンテンツに関する問題を報告