diff options
author | MDN <actions@users.noreply.github.com> | 2021-05-18 00:44:37 +0000 |
---|---|---|
committer | MDN <actions@users.noreply.github.com> | 2021-05-18 00:44:37 +0000 |
commit | 40edc745dfb5c152e12080748f9357b376e8dbe9 (patch) | |
tree | 00507f03ddb986f86fab1b6280661d4010a05b03 /files/ja/web/api | |
parent | ffc1c18ba7f546ef8103ad587592a2cfaf88e609 (diff) | |
download | translated-content-40edc745dfb5c152e12080748f9357b376e8dbe9.tar.gz translated-content-40edc745dfb5c152e12080748f9357b376e8dbe9.tar.bz2 translated-content-40edc745dfb5c152e12080748f9357b376e8dbe9.zip |
[CRON] sync translated content
Diffstat (limited to 'files/ja/web/api')
-rw-r--r-- | files/ja/web/api/parentnode/index.html | 92 | ||||
-rw-r--r-- | files/ja/web/api/parentnode/queryselectorall/index.html | 163 | ||||
-rw-r--r-- | files/ja/web/api/svgtransformable/index.html | 73 |
3 files changed, 0 insertions, 328 deletions
diff --git a/files/ja/web/api/parentnode/index.html b/files/ja/web/api/parentnode/index.html deleted file mode 100644 index f955ffc6c7..0000000000 --- a/files/ja/web/api/parentnode/index.html +++ /dev/null @@ -1,92 +0,0 @@ ---- -title: ParentNode -slug: Web/API/ParentNode -tags: - - API - - DOM - - Finding Elements - - Finding Nodes - - Interface - - Locating Elements - - Locating Nodes - - Managing Elements - - Managing Nodes - - Mixin - - Node - - ParentNode - - Reference - - Selectors -translation_of: Web/API/ParentNode ---- -<div>{{APIRef("DOM")}}</div> - -<p><span class="seoSummary"><code><strong>ParentNode</strong></code> ミックスインは、子を持つことができるすべての型の {{domxref("Node")}} オブジェクトに特有のメソッドやプロパティを含みます。</span>これは、{{domxref("Element")}} と {{domxref("Document")}}、{{domxref("DocumentFragment")}} オブジェクトに実装されています。</p> - -<p>対象のノードや要素を見つけるために<a href="/ja/docs/Web/CSS/CSS_Selectors">CSS セレクター</a>を使用する方法について、詳しくは<a href="/ja/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors">セレクタを使用した DOM 要素の指定</a>をご覧ください。</p> - -<h2 id="Properties" name="Properties">プロパティ</h2> - -<dl> - <dt>{{domxref("ParentNode.childElementCount")}} {{readonlyInline}}</dt> - <dd>オブジェクトが持つ子の数を表す <code>unsigned long</code> 値を返します。</dd> - <dt>{{domxref("ParentNode.children")}} {{readonlyInline}}</dt> - <dd>この <code>ParentNode</code> の子であるすべての {{domxref("Element")}} 型のオブジェクトを含む実際の {{domxref("HTMLCollection")}} を返します。要素ではないノードは省きます。</dd> - <dt>{{domxref("ParentNode.firstElementChild")}} {{readonlyInline}}</dt> - <dd>この <code>ParentNode</code> の最初の子である {{domxref("Element")}} を返します。存在しない場合は <code>null</code> を返す。</dd> - <dt>{{domxref("ParentNode.lastElementChild")}} {{readonlyInline}}</dt> - <dd>この <code>ParentNode</code> の最後の子である {{domxref("Element")}} を返します。存在しない場合は <code>null</code> を返す。</dd> -</dl> - -<h2 id="Methods" name="Methods">メソッド</h2> - -<dl> - <dt>{{domxref("ParentNode.append()")}} {{experimental_inline}}</dt> - <dd><code>ParentNode</code> の最後の子の後ろに、{{domxref("Node")}} オブジェクトまたは {{domxref("DOMString")}} オブジェクトのセットを挿入します。{{domxref("DOMString")}} オブジェクトは、同等の {{domxref("Text")}} ノードとして挿入されます。</dd> - <dt>{{domxref("ParentNode.prepend()")}} {{experimental_inline}}</dt> - <dd><code>ParentNode</code> の最初の子の前に、{{domxref("Node")}} オブジェクトまたは {{domxref("DOMString")}} オブジェクトのセットを挿入します。{{domxref("DOMString")}} オブジェクトは、同等の {{domxref("Text")}} ノードとして挿入されます。</dd> - <dt>{{domxref("ParentNode.querySelector()")}}</dt> - <dd>現在の要素をルートとして、指定したセレクターのグループにマッチする最初の {{domxref("Element")}} を返します。</dd> - <dt>{{domxref("ParentNode.querySelectorAll()")}}</dt> - <dd>現在の要素をルートとして、指定したセレクターのグループにマッチする要素のリストを表す {{domxref("NodeList")}} を返します。</dd> - <dt>{{domxref("ParentNode.replaceChildren()")}}</dt> - <dd>ノードの既存の子ノードを、指定した新しい子ノードのセットに入れ替えます。</dd> -</dl> - -<h2 id="Specification" name="Specification">仕様</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状況</th> - <th scope="col">コメント</th> - </tr> - <tr> - <td>{{SpecName('DOM WHATWG', '#parentnode', 'ParentNode')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td><code>ElementTraversal</code> インターフェイスを {{domxref("ChildNode")}} と {{domxref("ParentNode")}} に分割しました。{{domxref("ParentNode.firstElementChild")}} と {{domxref("ParentNode.lastElementChild")}}、{{domxref("ParentNode.childElementCount")}} プロパティは、後者で定義されていません。<br> - {{domxref("ParentNode.children")}} プロパティが追加されました。<br> - {{domxref("ParentNode.querySelector()")}}、{{domxref("ParentNode.querySelectorAll()")}}、{{domxref("ParentNode.append()")}}、{{domxref("ParentNode.prepend()")}} メソッドが追加されました。</td> - </tr> - <tr> - <td>{{SpecName('Element Traversal', '#interface-elementTraversal', 'ElementTraversal')}}</td> - <td>{{Spec2('Element Traversal')}}</td> - <td><code>ElementTraversal</code> 基本インターフェイスにこのプロパティの初期定義が追加され、{{domxref("Element")}} で使われます。</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> - - - -<p>{{Compat("api.ParentNode")}}</p> - -<h2 id="See_also" name="See_also">関連項目</h2> - -<ul> - <li>{{domxref("ChildNode")}} 基本インターフェース。</li> - <li> - <div class="syntaxbox">このミックスインを実装したオブジェクト型: {{domxref("Document")}} と {{domxref("Element")}}、{{domxref("DocumentFragment")}}。</div> - </li> -</ul> diff --git a/files/ja/web/api/parentnode/queryselectorall/index.html b/files/ja/web/api/parentnode/queryselectorall/index.html deleted file mode 100644 index 5a2673cc6b..0000000000 --- a/files/ja/web/api/parentnode/queryselectorall/index.html +++ /dev/null @@ -1,163 +0,0 @@ ---- -title: ParentNode.querySelectorAll() -slug: Web/API/ParentNode/querySelectorAll -tags: - - API - - DOM - - Document - - Finding Elements - - Finding Nodes - - Method - - ParentNode - - Reference - - Searching Elements - - Searching Nodes - - Selectors - - querySelectorAll -translation_of: Web/API/ParentNode/querySelectorAll ---- -<div>{{ApiRef("DOM")}}</div> - -<p>{{domxref("ParentNode")}} ミックスインは <code><strong>querySelectorAll()</strong></code> メソッドを定義しており、メソッド呼び出しの時点でそのオブジェクトの子孫にあたる要素のうち、一連のセレクターに一致するもののリストを示す {{domxref("NodeList")}} を返します。</p> - -<p>単一の結果のみが必要な場合は、代わりに {{domxref("ParentNode.querySelector", "querySelector()")}} メソッドを使用することを検討してください。</p> - -<div class="note"> -<p><strong>メモ:</strong> このメソッドは {{domxref("Element.querySelectorAll()")}}, {{domxref("Document.querySelectorAll()")}}, {{domxref("DocumentFragment.querySelectorAll()")}} として実装されています。</p> -</div> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox"><var>elementList</var> = <em>parentNode</em>.querySelectorAll(<var>selectors</var>); -</pre> - -<h3 id="Parameters" name="Parameters">引数</h3> - -<dl> - <dt><code>selectors</code></dt> - <dd>マッチのための 1 つまたは複数のセレクターを含む {{domxref("DOMString")}}。この文字列は妥当な <a href="/ja/docs/Web/CSS/CSS_Selectors">CSS セレクター</a>でなければならず、そうでない場合は <code>SyntaxError</code> 例外がスローされます。セレクターの仕様と要素の識別の詳細は、<a href="/ja/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors">セレクターを使用した DOM 要素の指定</a>を参照してください。複数のセレクターを指定する際は、カンマで区切ります。</dd> -</dl> - -<div class="note"> -<p><strong>メモ:</strong> 標準の CSS 構文の一部ではない文字は、バックスラッシュ文字を使ってエスケープしなければなりません。 JavaScript でもバックスラッシュによるエスケープが使われているため、これらの文字を使った文字列リテラルを記述する際は、特に注意する必要があります。詳細は {{anch("Escaping special characters")}} を参照してください。</p> -</div> - -<h3 id="Return_value" name="Return_value">返値</h3> - -<p>生きていない {{domxref("NodeList")}} で、指定されたセレクターの1つ以上に一致する子孫ノード1つに対して1つずつの {{domxref("Element")}} を含みます。</p> - -<div class="note"> -<p><strong>メモ:</strong> 指定された <code>selectors</code> が <a href="/ja/docs/Web/CSS/Pseudo-elements">CSS 擬似要素</a>を含む場合、返されるリストは常に空になります。</p> -</div> - -<h3 id="Exceptions" name="Exceptions">例外</h3> - -<dl> - <dt><code>SyntaxError</code></dt> - <dd>指定された <code>selectors</code> の構文が妥当ではない。</dd> -</dl> - -<h2 id="Examples" name="Examples">例</h2> - -<p>文書内のすべての {{HTMLElement("p")}} 要素の {{domxref("NodeList")}} を入手します。</p> - -<pre class="brush: js">var matches = document.querySelectorAll("p");</pre> - -<p>次の例では、文書内にある <code>note</code> または <code>alert</code> のいずれかのクラスを持つ、すべての {{HTMLElement("div")}} 要素のリストを返します。</p> - -<pre class="brush: js">var matches = document.querySelectorAll("div.note, div.alert"); -</pre> - -<p>次に、 <code>test</code> という ID を持つコンテナ内に位置し、直接の親要素が <code>highlighted</code> クラスを持つ {{HTMLElement("div")}} である、<code><p></code> 要素のリストを取得します。</p> - -<pre class="brush: js">var container = document.querySelector("#test"); -var matches = container.querySelectorAll("div.highlighted > p");</pre> - -<p>次の例では<a href="/ja/docs/Web/CSS/Attribute_selectors">属性セレクター</a>を使用しており、 <code>data-src</code> という名前の属性を持つ、文書内の {{HTMLElement("iframe")}} 要素のリストを返します。</p> - -<pre class="brush: js">var matches = document.querySelectorAll("iframe[data-src]");</pre> - -<p>次の例では、ID が <code>userlist</code> の要素の中にあり、<code>data-active</code> 属性を持ち、その値が <code>1</code> であるリスト項目のリストを返すため、属性セレクターが使用されています。</p> - -<pre class="brush: js">var container = document.querySelector("#userlist"); -var matches = container.querySelectorAll("li[data-active=1]");</pre> - -<h2 id="User_notes" name="User_notes">ユーザーのメモ</h2> - -<p>querySelectorAll() は、最も一般的な JavaScript DOM ライブラリと異なる動作を持ち、意図しない結果をもたらすことがあります。</p> - -<h3 id="HTML">HTML</h3> - -<p>次の、入れ子になった 3 つの {{HTMLElement("div")}} ブロックを持つ HTML について検討します。</p> - -<pre class="brush: html"><div class="outer"> - <div class="select"> - <div class="inner"> - </div> - </div> -</div></pre> - -<h3 id="JavaScript">JavaScript</h3> - -<pre class="brush: js">var select = document.querySelector('.select'); -var inner = select.querySelectorAll('.outer .inner'); -inner.length; // 1 です。0 ではありません! -</pre> - -<p>この例では、<code>select</code> class を持つ <code><div></code> の文脈で <code>.outer .inner</code> を選択するとき、<code>.outer</code> が基準となる要素(<code>.select</code> で検索される)の子孫ではないにもかかわらず、<code>.inner</code> class を持つ要素が見つけられています。<code>querySelectorAll()</code> はデフォルトでは、セレクターの最後の要素が検索スコープに含まれているかどうかのみ検証します。</p> - -<p>{{cssxref(":scope")}} 擬似クラスを使うと、基準となる要素の子孫だけが一致するようになり、期待される挙動を取り戻すことができます。</p> - -<pre class="brush: js">var select = document.querySelector('.select'); -var inner = select.querySelectorAll(':scope .outer .inner'); -inner.length; // 0</pre> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName("DOM WHATWG", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}</td> - <td>{{Spec2("DOM WHATWG")}}</td> - <td>Living standard</td> - </tr> - <tr> - <td>{{SpecName("Selectors API Level 2", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}</td> - <td>{{Spec2("Selectors API Level 2")}}</td> - <td>変更なし</td> - </tr> - <tr> - <td>{{SpecName("DOM4", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}</td> - <td>{{Spec2("DOM4")}}</td> - <td>初回定義</td> - </tr> - <tr> - <td>{{SpecName("Selectors API Level 1", "#interface-definitions", "document.querySelector()")}}</td> - <td>{{Spec2("Selectors API Level 1")}}</td> - <td>元の定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> - -<p>{{Compat("api.ParentNode.querySelectorAll")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li><a href="/ja/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors">セレクターを使用した DOM 要素の指定</a></li> - <li><a href="/ja/docs/Code_snippets/QuerySelector"><code>querySelector()</code> のコードスニペット</a></li> - <li>CSS ガイドの<a href="/ja/docs/Web/CSS/Attribute_selectors">属性セレクター</a></li> - <li>MDN 学習エリアの<a href="/ja/docs/Learn/CSS/Introduction_to_CSS/Attribute_selectors">属性セレクター</a></li> - <li>メソッドは {{domxref("Element.querySelectorAll()")}}, {{domxref("Document.querySelectorAll()")}}, {{domxref("DocumentFragment.querySelectorAll()")}} で利用可能です</li> -</ul> diff --git a/files/ja/web/api/svgtransformable/index.html b/files/ja/web/api/svgtransformable/index.html deleted file mode 100644 index 5683065157..0000000000 --- a/files/ja/web/api/svgtransformable/index.html +++ /dev/null @@ -1,73 +0,0 @@ ---- -title: SVGTransformable -slug: Web/API/SVGTransformable -tags: - - API - - NeedsExample - - Reference - - Référence(2) - - SVG - - SVG DOM -translation_of: Web/API/SVGTransformable ---- -<div>{{APIRef("SVG")}}</div> - -<h2 id="SVG_transformable_interface">SVG transformable interface</h2> - -<p>インターフェイス <code>SVGTransformable</code> には、属性 {{ SVGAttr("transform") }}. を持つ全ての要素に適用されるプロパティとメソッドが含まれています。</p> - -<h3 id="インターフェイスの概要">インターフェイスの概要</h3> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="row">Also implement</th> - <td><em>無し</em></td> - </tr> - <tr> - <th scope="row">Methods</th> - <td><em>無し</em></td> - </tr> - <tr> - <th scope="row">Properties</th> - <td> - <ul> - <li>読み取り専用 {{ domxref("SVGAnimatedTransformList") }} <code>transform</code></li> - </ul> - </td> - </tr> - <tr> - <th scope="row">Normative document</th> - <td><a class="external" href="http://www.w3.org/TR/SVG11/types.html#InterfaceSVGTransformable" title="http://www.w3.org/TR/SVG11/types.html#InterfaceSVGTransformable">SVG 1.1 (2nd Edition)</a></td> - </tr> - </tbody> -</table> - -<h2 id="プロパティ">プロパティ</h2> - -<table class="standard-table"> - <thead> - <tr> - <th>名前</th> - <th>型</th> - <th>説明</th> - </tr> - </thead> - <tbody> - <tr> - <td><code>transform</code></td> - <td>{{ domxref("SVGAnimatedTransformList") }}</td> - <td>指定された要素の属性 {{ SVGAttr("transform") }} に対応します。</td> - </tr> - </tbody> -</table> - -<h2 id="メソッド">メソッド</h2> - -<p><code>SVGTransformable</code> インターフェイスは、特定のメソッドを提供しません。</p> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> - - - -<p>{{Compat("api.SVGTransformable")}}</p> |