From d442036b47072f6065eb70d07baecde849189c09 Mon Sep 17 00:00:00 2001 From: Masahiro Fujimoto Date: Thu, 4 Nov 2021 20:19:23 +0900 Subject: Web/API/Document/importNode を更新 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 2021/09/15 時点の英語版に同期 --- files/ja/web/api/document/importnode/index.md | 135 ++++++++++---------------- 1 file changed, 53 insertions(+), 82 deletions(-) diff --git a/files/ja/web/api/document/importnode/index.md b/files/ja/web/api/document/importnode/index.md index 5484b1b0a0..9bf207226a 100644 --- a/files/ja/web/api/document/importnode/index.md +++ b/files/ja/web/api/document/importnode/index.md @@ -5,105 +5,76 @@ tags: - API - DOM - Document - - Method - - Node - - Reference - - copy + - メソッド + - ノード + - リファレンス + - コピー - importNode +browser-compat: api.Document.importNode translation_of: Web/API/Document/importNode --- -
{{APIRef("DOM")}}
+{{APIRef("DOM")}} -

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

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

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

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

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

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

構文

+## 構文 -
const importedNode = document.importNode(externalNode [, deep]);
-
+```js +importNode(externalNode) +importNode(externalNode, deep) +``` -

引数

+### 引数 -
-
externalNode
-
現在の文書にインポートする、外部の {{domxref("Node")}} または {{domxref("DocumentFragment")}} です。
-
deep {{optional_inline}}
-
論理値で、 externalNode の DOM サブツリー全体をインポートするかどうかを制御します。 -
    -
  • deep が true に設定された場合、 externalNode およびその子孫全てが複製されます。
    • -
  • deep が false に設定された場合、 externalNode のみがインポートされます — 新しいノードには子ノードはない状態になります。
    • -
+- `externalNode` + - : 現在の文書にインポートする、外部の {{domxref("Node")}} または {{domxref("DocumentFragment")}} です。 +- `deep` {{optional_inline}} -
-

中: DOM4 仕様書では、 deep 羽オプションの引数で、既定値は true でした。

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

最新の仕様書ではこの既定値が変更されました。新しい既定値は false になりました。

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

おすすめの方法: これは現在もオプションの引数ですが、常に deep 引数を渡すことが後方互換性および前方互換性には有用です。

+### 返値 -
    -
  • Gecko 28.0 {{geckoRelease(28)}} では、コンソールでこの引数を省略しないよう開発者に警告しています。
    • -
  • Gecko 29.0 {{geckoRelease(29)}}) 以降、深いクローンではなく浅いクローンが既定値になっています。
    • -
-
-
-
+インポートする側の文書のスコープにコピーされた `importedNode` です。 -

返値

+> **Note:** `importedNode` の {{domxref("Node.parentNode")}} は `null` になります。まだ文書ツリーに挿入されていないからです。 -

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

+## 例 -
-

注: importedNode's {{domxref("Node.parentNode")}} は null になります。まだ文書ツリーに挿入されていないからです。

-
- -

例

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

注

- -

{{page("/ja/docs/Web/API/Document/adoptNode", "Notes")}}

- -

仕様書

- - - - - - - - - - - - - - - - - - - - - -
仕様書状態備考
{{SpecName("DOM WHATWG", "#dom-document-importnode", "document.importNode()")}}{{Spec2("DOM WHATWG")}}
{{SpecName("DOM2 Core", "core.html#Core-Document-importNode", "document.importNode()")}}{{Spec2("DOM2 Core")}}初回定義
- -

ブラウザーの互換性

- -

{{Compat("api.Document.importNode")}}

- -

関連情報

- - +``` + +## メモ + +外部文書からのノードは、現在の文書に挿入する前に、次のいずれかの状態にしなければなりません。 + +- {{domXref("document.importNode()")}} でクローンする、または +- {{domXref("document.adoptNode()")}} で移行する + +> **Note:** Firefox は今のところこのルールを強制していませんが、将来の互換性を改善するために、このルールに従うことを強く推奨します。 + +{{domXref("Node.ownerDocument")}} の問題に関して詳しくは、W3C DOM FAQ を参照してください。 + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- {{domxref("document.adoptNode()")}} このメソッドととても似た動作を行う +- {{domxref("Node.appendChild()")}} +- {{domxref("Node.insertBefore()")}} -- cgit v1.2.3-54-g00ecf