From 035535ba507b9e36b058bd9843242e1bcbda1be3 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Tue, 18 Jan 2022 21:57:08 +0900 Subject: ウェブコンポーネント関係の Web API の記事を移行 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/api/element/attachshadow/index.html | 164 ----------------------- files/ja/web/api/element/attachshadow/index.md | 164 +++++++++++++++++++++++ files/ja/web/api/element/shadowroot/index.html | 86 ------------ files/ja/web/api/element/shadowroot/index.md | 86 ++++++++++++ files/ja/web/api/element/slot/index.html | 60 --------- files/ja/web/api/element/slot/index.md | 60 +++++++++ files/ja/web/api/node/getrootnode/index.html | 98 -------------- files/ja/web/api/node/getrootnode/index.md | 98 ++++++++++++++ 8 files changed, 408 insertions(+), 408 deletions(-) delete mode 100644 files/ja/web/api/element/attachshadow/index.html create mode 100644 files/ja/web/api/element/attachshadow/index.md delete mode 100644 files/ja/web/api/element/shadowroot/index.html create mode 100644 files/ja/web/api/element/shadowroot/index.md delete mode 100644 files/ja/web/api/element/slot/index.html create mode 100644 files/ja/web/api/element/slot/index.md delete mode 100644 files/ja/web/api/node/getrootnode/index.html create mode 100644 files/ja/web/api/node/getrootnode/index.md (limited to 'files/ja') diff --git a/files/ja/web/api/element/attachshadow/index.html b/files/ja/web/api/element/attachshadow/index.html deleted file mode 100644 index 6237554ad3..0000000000 --- a/files/ja/web/api/element/attachshadow/index.html +++ /dev/null @@ -1,164 +0,0 @@ ---- -title: Element.attachShadow() -slug: Web/API/Element/attachShadow -tags: - - API - - Element - - Method - - Reference - - attachShadow - - shadow dom - - メソッド -translation_of: Web/API/Element/attachShadow ---- -
{{APIRef('Shadow DOM')}}
- -

Element.attachShadow() メソッドは、シャドウ DOM ツリーを特定の要素に追加し、そのシャドウルート ({{domxref("ShadowRoot")}}) への参照を返します。

- -

シャドウツリーを追加できる要素

- -

シャドウルートは全ての要素に追加できるわけではありません。 ({{htmlelement("a")}} など) セキュリティ上の理由でシャドウ DOM を持てないものもあります。以下にシャドウルートを追加できる要素を列挙します。

- - - -

構文

- -
var shadowroot = element.attachShadow(shadowRootInit);
-
- -

引数

- -
-
shadowRootInit
-
ShadowRootInit ディクショナリで、以下のプロパティを含みます。 -
-
mode
-
-

文字列で、シャドウ DOM ツリーのカプセル化モードを指定します。以下のうちの一つを取ります。

- -
    -
  • open: シャドウルートに外部の JavaScript からアクセスできます。例えば、 {{domxref("Element.shadowRoot")}} を使ってアクセスできます。
    - - 
    element.shadowRoot; // ShadowRoot オブジェクトを返します
    -
    • -
  • closed: シャドウルートに外部の JavaScript からアクセスできません。
    - - 
    element.shadowRoot; // null を返します
-
    -
    • -
-
-
delegatesFocus
-
真偽値で、 true に設定された場合、フォーカス可能性に関するカスタム要素の問題を緩和します。シャドウ DOM のフォーカスができない部分がクリックされた場合、最初のフォーカス可能な部分がフォーカスを得て、シャドウホストは :focus のスタイルを利用することができます。
-
-
-
- -

返値

- -

{{domxref("ShadowRoot")}} オブジェクトです。

- -

例外

- - - - - - - - - - - - - - - - - - -
例外説明
InvalidStateErrorshadow root を追加しようとしている要素は、すでに shadow host です。
NotSupportedErrorshadow root を追加しようとしている要素は、HTML の名前空間外であるか、shadow DOM を持てない要素です(上記の通り)。
- -

例

- -

以下の例は word-count-web-component のデモを使用しています(実行例)。 attachShadow() はコードの真ん中付近で shadow root を作るために使用されています。その後カスタム要素を追加しています。

- -
// Create a class for the element
-class WordCount extends HTMLParagraphElement {
-  constructor() {
-    // Always call super first in constructor
-    super();
-
-    // count words in element's parent element
-    var wcParent = this.parentNode;
-
-    function countWords(node){
-      var text = node.innerText || node.textContent
-      return text.split(/\s+/g).length;
-    }
-
-    var count = 'Words: ' + countWords(wcParent);
-
-    // Create a shadow root
-    var shadow = this.attachShadow({mode: 'open'});
-
-    // Create text node and add word count to it
-    var text = document.createElement('span');
-    text.textContent = count;
-
-    // Append it to the shadow root
-    shadow.appendChild(text);
-
-    // Update count when element content changes
-    setInterval(function() {
-      var count = 'Words: ' + countWords(wcParent);
-      text.textContent = count;
-    }, 200)
-  }
-}
-
-// Define the new element
-customElements.define('word-count', WordCount, { extends: 'p' });
- -

仕様書

- - - - - - - - - - - - - - - - -
仕様書状態備考
{{SpecName('DOM WHATWG', '#dom-element-attachshadow', 'attachShadow()')}}{{Spec2('DOM WHATWG')}}
- -

ブラウザーの互換性

- -

{{Compat("api.Element.attachShadow")}}

diff --git a/files/ja/web/api/element/attachshadow/index.md b/files/ja/web/api/element/attachshadow/index.md new file mode 100644 index 0000000000..6237554ad3 --- /dev/null +++ b/files/ja/web/api/element/attachshadow/index.md @@ -0,0 +1,164 @@ +--- +title: Element.attachShadow() +slug: Web/API/Element/attachShadow +tags: + - API + - Element + - Method + - Reference + - attachShadow + - shadow dom + - メソッド +translation_of: Web/API/Element/attachShadow +--- +
{{APIRef('Shadow DOM')}}
+ +

Element.attachShadow() メソッドは、シャドウ DOM ツリーを特定の要素に追加し、そのシャドウルート ({{domxref("ShadowRoot")}}) への参照を返します。

+ +

シャドウツリーを追加できる要素

+ +

シャドウルートは全ての要素に追加できるわけではありません。 ({{htmlelement("a")}} など) セキュリティ上の理由でシャドウ DOM を持てないものもあります。以下にシャドウルートを追加できる要素を列挙します。

+ + + +

構文

+ +
var shadowroot = element.attachShadow(shadowRootInit);
+
+ +

引数

+ +
+
shadowRootInit
+
ShadowRootInit ディクショナリで、以下のプロパティを含みます。 +
+
mode
+
+

文字列で、シャドウ DOM ツリーのカプセル化モードを指定します。以下のうちの一つを取ります。

+ +
    +
  • open: シャドウルートに外部の JavaScript からアクセスできます。例えば、 {{domxref("Element.shadowRoot")}} を使ってアクセスできます。
    + + 
    element.shadowRoot; // ShadowRoot オブジェクトを返します
    +
    • +
  • closed: シャドウルートに外部の JavaScript からアクセスできません。
    + + 
    element.shadowRoot; // null を返します
+
    +
    • +
+
+
delegatesFocus
+
真偽値で、 true に設定された場合、フォーカス可能性に関するカスタム要素の問題を緩和します。シャドウ DOM のフォーカスができない部分がクリックされた場合、最初のフォーカス可能な部分がフォーカスを得て、シャドウホストは :focus のスタイルを利用することができます。
+
+
+
+ +

返値

+ +

{{domxref("ShadowRoot")}} オブジェクトです。

+ +

例外

+ + + + + + + + + + + + + + + + + + +
例外説明
InvalidStateErrorshadow root を追加しようとしている要素は、すでに shadow host です。
NotSupportedErrorshadow root を追加しようとしている要素は、HTML の名前空間外であるか、shadow DOM を持てない要素です(上記の通り)。
+ +

例

+ +

以下の例は word-count-web-component のデモを使用しています(実行例)。 attachShadow() はコードの真ん中付近で shadow root を作るために使用されています。その後カスタム要素を追加しています。

+ +
// Create a class for the element
+class WordCount extends HTMLParagraphElement {
+  constructor() {
+    // Always call super first in constructor
+    super();
+
+    // count words in element's parent element
+    var wcParent = this.parentNode;
+
+    function countWords(node){
+      var text = node.innerText || node.textContent
+      return text.split(/\s+/g).length;
+    }
+
+    var count = 'Words: ' + countWords(wcParent);
+
+    // Create a shadow root
+    var shadow = this.attachShadow({mode: 'open'});
+
+    // Create text node and add word count to it
+    var text = document.createElement('span');
+    text.textContent = count;
+
+    // Append it to the shadow root
+    shadow.appendChild(text);
+
+    // Update count when element content changes
+    setInterval(function() {
+      var count = 'Words: ' + countWords(wcParent);
+      text.textContent = count;
+    }, 200)
+  }
+}
+
+// Define the new element
+customElements.define('word-count', WordCount, { extends: 'p' });
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('DOM WHATWG', '#dom-element-attachshadow', 'attachShadow()')}}{{Spec2('DOM WHATWG')}}
+ +

ブラウザーの互換性

+ +

{{Compat("api.Element.attachShadow")}}

diff --git a/files/ja/web/api/element/shadowroot/index.html b/files/ja/web/api/element/shadowroot/index.html deleted file mode 100644 index 148410966c..0000000000 --- a/files/ja/web/api/element/shadowroot/index.html +++ /dev/null @@ -1,86 +0,0 @@ ---- -title: Element.shadowRoot -slug: Web/API/Element/shadowRoot -tags: - - プロパティ - - リファレンス - - 要素 - - 試験的 -translation_of: Web/API/Element/shadowRoot ---- -

{{APIRef('Shadow DOM')}} {{SeeCompatTable}}{{draft}}

- -

読み取り専用のプロパティであるElement.shadowRootは、そのエレメントによってホストされたshadow rootへの読み取りアクセスを提供します。既に存在している要素にshadow rootを追加する場合は {{domxref('Element.attachShadow')}} を使用してください。

- -

文法

- -
var shadowroot = element.shadowRoot;
-
- -

値

- -

{{domxref('ShadowRoot')}} オブジェクトです。 アタッチされた時の{{DOMxRef("ShadowRoot.mode", "mode")}} に closed が指定された場合には  null となります。

- -

Examples

- -

The following snippets are taken from our life-cycle-callbacks example (see it live also), which creates an element that displays a square of a size and color specified in the element's attributes.

- -

Inside the <custom-square> element's class definition we include some life cycle callbacks that make a call to an external function, updateStyle(), which actually applies the size and color to the element. You'll see that we are passing it this (the custom element itself) as a parameter.

- -
connectedCallback() {
-  console.log('Custom square element added to page.');
-  updateStyle(this);
-}
-
-attributeChangedCallback(name, oldValue, newValue) {
-  console.log('Custom square element attributes changed.');
-  updateStyle(this);
-}
- -

In the updateStyle() function itself, we get a reference to the shadow DOM using {{domxref("Element.shadowRoot")}}. From here we use standard DOM traversal techniques to find the {{htmlelement("style")}} element inside the shadow DOM and then update the CSS found inside it:

- -
function updateStyle(elem) {
-  const shadow = elem.shadowRoot;
-  const childNodes = Array.from(shadow.childNodes);
-
-  childNodes.forEach(childNode => {
-    if (childNode.nodeName === 'STYLE') {
-      childNode.textContent = `
-        div {
-          width: ${elem.getAttribute('l')}px;
-          height: ${elem.getAttribute('l')}px;
-          background-color: ${elem.getAttribute('c')};
-        }
-      `;
-    }
-  });
-}
- -

仕様

- - - - - - - - - - - - - - -
仕様状態注脚
{{SpecName('DOM WHATWG', '#dom-element-shadowroot', 'shadowRoot')}}{{Spec2('DOM WHATWG')}}
- -

ブラウザ互換性

- - - -

{{Compat("api.Element.shadowRoot")}}

- -

関連情報

- - diff --git a/files/ja/web/api/element/shadowroot/index.md b/files/ja/web/api/element/shadowroot/index.md new file mode 100644 index 0000000000..148410966c --- /dev/null +++ b/files/ja/web/api/element/shadowroot/index.md @@ -0,0 +1,86 @@ +--- +title: Element.shadowRoot +slug: Web/API/Element/shadowRoot +tags: + - プロパティ + - リファレンス + - 要素 + - 試験的 +translation_of: Web/API/Element/shadowRoot +--- +

{{APIRef('Shadow DOM')}} {{SeeCompatTable}}{{draft}}

+ +

読み取り専用のプロパティであるElement.shadowRootは、そのエレメントによってホストされたshadow rootへの読み取りアクセスを提供します。既に存在している要素にshadow rootを追加する場合は {{domxref('Element.attachShadow')}} を使用してください。

+ +

文法

+ +
var shadowroot = element.shadowRoot;
+
+ +

値

+ +

{{domxref('ShadowRoot')}} オブジェクトです。 アタッチされた時の{{DOMxRef("ShadowRoot.mode", "mode")}} に closed が指定された場合には  null となります。

+ +

Examples

+ +

The following snippets are taken from our life-cycle-callbacks example (see it live also), which creates an element that displays a square of a size and color specified in the element's attributes.

+ +

Inside the <custom-square> element's class definition we include some life cycle callbacks that make a call to an external function, updateStyle(), which actually applies the size and color to the element. You'll see that we are passing it this (the custom element itself) as a parameter.

+ +
connectedCallback() {
+  console.log('Custom square element added to page.');
+  updateStyle(this);
+}
+
+attributeChangedCallback(name, oldValue, newValue) {
+  console.log('Custom square element attributes changed.');
+  updateStyle(this);
+}
+ +

In the updateStyle() function itself, we get a reference to the shadow DOM using {{domxref("Element.shadowRoot")}}. From here we use standard DOM traversal techniques to find the {{htmlelement("style")}} element inside the shadow DOM and then update the CSS found inside it:

+ +
function updateStyle(elem) {
+  const shadow = elem.shadowRoot;
+  const childNodes = Array.from(shadow.childNodes);
+
+  childNodes.forEach(childNode => {
+    if (childNode.nodeName === 'STYLE') {
+      childNode.textContent = `
+        div {
+          width: ${elem.getAttribute('l')}px;
+          height: ${elem.getAttribute('l')}px;
+          background-color: ${elem.getAttribute('c')};
+        }
+      `;
+    }
+  });
+}
+ +

仕様

+ + + + + + + + + + + + + + +
仕様状態注脚
{{SpecName('DOM WHATWG', '#dom-element-shadowroot', 'shadowRoot')}}{{Spec2('DOM WHATWG')}}
+ +

ブラウザ互換性

+ + + +

{{Compat("api.Element.shadowRoot")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/element/slot/index.html b/files/ja/web/api/element/slot/index.html deleted file mode 100644 index 188d164da6..0000000000 --- a/files/ja/web/api/element/slot/index.html +++ /dev/null @@ -1,60 +0,0 @@ ---- -title: Element.slot -slug: Web/API/Element/slot -translation_of: Web/API/Element/slot ---- -

{{APIRef("Shadow DOM")}}

- -

{{domxref("Element")}} インターフェースの slot プロパティは shadow DOM slot の名前を返します。

- -

slot は、web コンポーネント の中にユーザーが任意のマークアップを代入できる要素を提供します (template と slot の使い方 により詳しい説明があります)。

- -

Syntax

- -
var aString = element.slot
-element.slot = aString
-
- -

値

- -

{{domxref("DOMString")}}

- -

例

- -

templateのサンプル (実行例)では、<my-paragraph> と名付けた簡単なカスタム要素を作っています。このカスタム要素には、shadow root が付いており、my-text と名付けられた slot 要素が含まれています。

- -

<my-paragraph> がドキュメントの中で利用された時、その内部で slot 属性を my-text に設定した要素を作ることで、slot の内容を変更することができます。 

- -
<my-paragraph>
-  <span slot="my-text">新しいテキストを代入します</span>
-</my-paragraph>
- -

JavaScript ファイルで {{htmlelement("span")}} への参照を取得すると、対応する <slot> の名前を取得できます。 

- -
let slottedSpan = document.querySelector('my-paragraph span')
-console.log(slottedSpan.slot); // 'my-text' と表示されます
- -

仕様

- - - - - - - - - - - - - - -
仕様書策定状況コメント
{{SpecName('DOM WHATWG','#dom-element-slot','slot')}}{{Spec2('DOM WHATWG')}} 
- -

ブラウザ実装状況

- -
- - -

{{Compat("api.Element.slot")}}

-
diff --git a/files/ja/web/api/element/slot/index.md b/files/ja/web/api/element/slot/index.md new file mode 100644 index 0000000000..188d164da6 --- /dev/null +++ b/files/ja/web/api/element/slot/index.md @@ -0,0 +1,60 @@ +--- +title: Element.slot +slug: Web/API/Element/slot +translation_of: Web/API/Element/slot +--- +

{{APIRef("Shadow DOM")}}

+ +

{{domxref("Element")}} インターフェースの slot プロパティは shadow DOM slot の名前を返します。

+ +

slot は、web コンポーネント の中にユーザーが任意のマークアップを代入できる要素を提供します (template と slot の使い方 により詳しい説明があります)。

+ +

Syntax

+ +
var aString = element.slot
+element.slot = aString
+
+ +

値

+ +

{{domxref("DOMString")}}

+ +

例

+ +

templateのサンプル (実行例)では、<my-paragraph> と名付けた簡単なカスタム要素を作っています。このカスタム要素には、shadow root が付いており、my-text と名付けられた slot 要素が含まれています。

+ +

<my-paragraph> がドキュメントの中で利用された時、その内部で slot 属性を my-text に設定した要素を作ることで、slot の内容を変更することができます。 

+ +
<my-paragraph>
+  <span slot="my-text">新しいテキストを代入します</span>
+</my-paragraph>
+ +

JavaScript ファイルで {{htmlelement("span")}} への参照を取得すると、対応する <slot> の名前を取得できます。 

+ +
let slottedSpan = document.querySelector('my-paragraph span')
+console.log(slottedSpan.slot); // 'my-text' と表示されます
+ +

仕様

+ + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName('DOM WHATWG','#dom-element-slot','slot')}}{{Spec2('DOM WHATWG')}} 
+ +

ブラウザ実装状況

+ +
+ + +

{{Compat("api.Element.slot")}}

+
diff --git a/files/ja/web/api/node/getrootnode/index.html b/files/ja/web/api/node/getrootnode/index.html deleted file mode 100644 index 911233ed0d..0000000000 --- a/files/ja/web/api/node/getrootnode/index.html +++ /dev/null @@ -1,98 +0,0 @@ ---- -title: Node.getRootNode() -slug: Web/API/Node/getRootNode -tags: - - API - - DOM - - Method - - Node - - Reference - - getRootNode - - メソッド -translation_of: Web/API/Node/getRootNode ---- -
{{APIRef("DOM")}}
- -

getRootNode() は {{domxref("Node")}} インターフェイスのメソッドで、そのコンテキストのオブジェクトのルート、利用できる場合はオプションでシャドウルートを含んだものを返します。

- -

構文

- -
var root = node.getRootNode(options);
- -

引数

- -
-
options {{optional_inline}}
-
ルートノードを取得するためのオプションを設定するオブジェクトです。利用可能なオプションは次の通りです。 -
    -
  • composed: {{jsxref('Boolean')}} 値で、シャドウルートを返すか (false、既定値)、またはシャドウルートを越えたルートノードを返すか (true) を示します。
    • -
-
-
- -

返値

- -

{{domxref('Node')}} を継承したオブジェクトです。これはどこで getRootNode() を呼び出したかによって異なる形になります。例えば、

- - - -

例

- -

最初に、 HTML/document ノードの参照を返す単純な例です。

- -
rootNode = node.getRootNode();
- -

この例はもっと複雑で、通常のルートを返す場合と、シャドウルートを含むルートの違いを示します。 (ソースコード全体を見てください。)

- -
<!-- source: https://github.com/jserz/js_piece/blob/master/DOM/Node/getRootNode()/demo/getRootNode.html -->
-<div class="js-parent">
-  <div class="js-child"></div>
-</div>
-<div class="js-shadowHost"></div>
-<script>
-  // Chrome 54+，Opera 41+ で動作
-
-  var parent = document.querySelector('.js-parent'),
-      child = document.querySelector('.js-child'),
-      shadowHost = document.querySelector('.js-shadowHost');
-
-  console.log(parent.getRootNode().nodeName); // #document
-  console.log(child.getRootNode().nodeName); // #document
-
-  // ShadowRoot の生成
-  var shadowRoot = shadowHost.attachShadow({mode:'open'});
-  shadowRoot.innerHTML = '<style>div{background:#2bb8aa;}</style>'
-      + '<div class="js-shadowChild">content</div>';
-  var shadowChild = shadowRoot.querySelector('.js-shadowChild');
-
-  // 合成の既定値は false
-  console.log(shadowChild.getRootNode() === shadowRoot); // true
-  console.log(shadowChild.getRootNode({composed:false}) === shadowRoot); // true
-  console.log(shadowChild.getRootNode({composed:true}).nodeName); // #document
-</script>
- -

仕様書

- - - - - - - - - - - - - - - - -
仕様書状態備考
{{SpecName('DOM WHATWG','#dom-node-getrootnode','getRootNode()')}}{{Spec2('DOM WHATWG')}}初回定義
- -

ブラウザーの互換性

- -

{{Compat("api.Node.getRootNode")}}

diff --git a/files/ja/web/api/node/getrootnode/index.md b/files/ja/web/api/node/getrootnode/index.md new file mode 100644 index 0000000000..911233ed0d --- /dev/null +++ b/files/ja/web/api/node/getrootnode/index.md @@ -0,0 +1,98 @@ +--- +title: Node.getRootNode() +slug: Web/API/Node/getRootNode +tags: + - API + - DOM + - Method + - Node + - Reference + - getRootNode + - メソッド +translation_of: Web/API/Node/getRootNode +--- +
{{APIRef("DOM")}}
+ +

getRootNode() は {{domxref("Node")}} インターフェイスのメソッドで、そのコンテキストのオブジェクトのルート、利用できる場合はオプションでシャドウルートを含んだものを返します。

+ +

構文

+ +
var root = node.getRootNode(options);
+ +

引数

+ +
+
options {{optional_inline}}
+
ルートノードを取得するためのオプションを設定するオブジェクトです。利用可能なオプションは次の通りです。 +
    +
  • composed: {{jsxref('Boolean')}} 値で、シャドウルートを返すか (false、既定値)、またはシャドウルートを越えたルートノードを返すか (true) を示します。
    • +
+
+
+ +

返値

+ +

{{domxref('Node')}} を継承したオブジェクトです。これはどこで getRootNode() を呼び出したかによって異なる形になります。例えば、

+ + + +

例

+ +

最初に、 HTML/document ノードの参照を返す単純な例です。

+ +
rootNode = node.getRootNode();
+ +

この例はもっと複雑で、通常のルートを返す場合と、シャドウルートを含むルートの違いを示します。 (ソースコード全体を見てください。)

+ +
<!-- source: https://github.com/jserz/js_piece/blob/master/DOM/Node/getRootNode()/demo/getRootNode.html -->
+<div class="js-parent">
+  <div class="js-child"></div>
+</div>
+<div class="js-shadowHost"></div>
+<script>
+  // Chrome 54+，Opera 41+ で動作
+
+  var parent = document.querySelector('.js-parent'),
+      child = document.querySelector('.js-child'),
+      shadowHost = document.querySelector('.js-shadowHost');
+
+  console.log(parent.getRootNode().nodeName); // #document
+  console.log(child.getRootNode().nodeName); // #document
+
+  // ShadowRoot の生成
+  var shadowRoot = shadowHost.attachShadow({mode:'open'});
+  shadowRoot.innerHTML = '<style>div{background:#2bb8aa;}</style>'
+      + '<div class="js-shadowChild">content</div>';
+  var shadowChild = shadowRoot.querySelector('.js-shadowChild');
+
+  // 合成の既定値は false
+  console.log(shadowChild.getRootNode() === shadowRoot); // true
+  console.log(shadowChild.getRootNode({composed:false}) === shadowRoot); // true
+  console.log(shadowChild.getRootNode({composed:true}).nodeName); // #document
+</script>
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('DOM WHATWG','#dom-node-getrootnode','getRootNode()')}}{{Spec2('DOM WHATWG')}}初回定義
+ +

ブラウザーの互換性

+ +

{{Compat("api.Node.getRootNode")}}

-- cgit v1.2.3-54-g00ecf