From 40edc745dfb5c152e12080748f9357b376e8dbe9 Mon Sep 17 00:00:00 2001 From: MDN Date: Tue, 18 May 2021 00:44:37 +0000 Subject: [CRON] sync translated content --- files/ja/orphaned/web/api/parentnode/index.html | 93 ++++++++++++ .../web/api/parentnode/queryselectorall/index.html | 164 +++++++++++++++++++++ .../orphaned/web/api/svgtransformable/index.html | 74 ++++++++++ 3 files changed, 331 insertions(+) create mode 100644 files/ja/orphaned/web/api/parentnode/index.html create mode 100644 files/ja/orphaned/web/api/parentnode/queryselectorall/index.html create mode 100644 files/ja/orphaned/web/api/svgtransformable/index.html (limited to 'files/ja/orphaned') diff --git a/files/ja/orphaned/web/api/parentnode/index.html b/files/ja/orphaned/web/api/parentnode/index.html new file mode 100644 index 0000000000..5d1ec6c97e --- /dev/null +++ b/files/ja/orphaned/web/api/parentnode/index.html @@ -0,0 +1,93 @@ +--- +title: ParentNode +slug: orphaned/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 +original_slug: Web/API/ParentNode +--- +
{{APIRef("DOM")}}
+ +

ParentNode ミックスインは、子を持つことができるすべての型の {{domxref("Node")}} オブジェクトに特有のメソッドやプロパティを含みます。これは、{{domxref("Element")}} と {{domxref("Document")}}、{{domxref("DocumentFragment")}} オブジェクトに実装されています。

+ +

対象のノードや要素を見つけるためにCSS セレクターを使用する方法について、詳しくはセレクタを使用した DOM 要素の指定をご覧ください。

+ +

プロパティ

+ +
+
{{domxref("ParentNode.childElementCount")}} {{readonlyInline}}
+
オブジェクトが持つ子の数を表す unsigned long 値を返します。
+
{{domxref("ParentNode.children")}} {{readonlyInline}}
+
この ParentNode の子であるすべての {{domxref("Element")}} 型のオブジェクトを含む実際の {{domxref("HTMLCollection")}} を返します。要素ではないノードは省きます。
+
{{domxref("ParentNode.firstElementChild")}} {{readonlyInline}}
+
この ParentNode の最初の子である {{domxref("Element")}} を返します。存在しない場合は null を返す。
+
{{domxref("ParentNode.lastElementChild")}} {{readonlyInline}}
+
この ParentNode の最後の子である {{domxref("Element")}} を返します。存在しない場合は null を返す。
+
+ +

メソッド

+ +
+
{{domxref("ParentNode.append()")}} {{experimental_inline}}
+
ParentNode の最後の子の後ろに、{{domxref("Node")}} オブジェクトまたは {{domxref("DOMString")}} オブジェクトのセットを挿入します。{{domxref("DOMString")}} オブジェクトは、同等の {{domxref("Text")}} ノードとして挿入されます。
+
{{domxref("ParentNode.prepend()")}} {{experimental_inline}}
+
ParentNode の最初の子の前に、{{domxref("Node")}} オブジェクトまたは {{domxref("DOMString")}} オブジェクトのセットを挿入します。{{domxref("DOMString")}} オブジェクトは、同等の {{domxref("Text")}} ノードとして挿入されます。
+
{{domxref("ParentNode.querySelector()")}}
+
現在の要素をルートとして、指定したセレクターのグループにマッチする最初の {{domxref("Element")}} を返します。
+
{{domxref("ParentNode.querySelectorAll()")}}
+
現在の要素をルートとして、指定したセレクターのグループにマッチする要素のリストを表す {{domxref("NodeList")}} を返します。
+
{{domxref("ParentNode.replaceChildren()")}}
+
ノードの既存の子ノードを、指定した新しい子ノードのセットに入れ替えます。
+
+ +

仕様

+ + + + + + + + + + + + + + + + + + + +
仕様書状況コメント
{{SpecName('DOM WHATWG', '#parentnode', 'ParentNode')}}{{Spec2('DOM WHATWG')}}ElementTraversal インターフェイスを {{domxref("ChildNode")}} と {{domxref("ParentNode")}} に分割しました。{{domxref("ParentNode.firstElementChild")}} と {{domxref("ParentNode.lastElementChild")}}、{{domxref("ParentNode.childElementCount")}} プロパティは、後者で定義されていません。
+ {{domxref("ParentNode.children")}} プロパティが追加されました。
+ {{domxref("ParentNode.querySelector()")}}、{{domxref("ParentNode.querySelectorAll()")}}、{{domxref("ParentNode.append()")}}、{{domxref("ParentNode.prepend()")}} メソッドが追加されました。
{{SpecName('Element Traversal', '#interface-elementTraversal', 'ElementTraversal')}}{{Spec2('Element Traversal')}}ElementTraversal 基本インターフェイスにこのプロパティの初期定義が追加され、{{domxref("Element")}} で使われます。
+ +

ブラウザー実装状況

+ + + +

{{Compat("api.ParentNode")}}

+ +

関連項目

+ + diff --git a/files/ja/orphaned/web/api/parentnode/queryselectorall/index.html b/files/ja/orphaned/web/api/parentnode/queryselectorall/index.html new file mode 100644 index 0000000000..de66ebb363 --- /dev/null +++ b/files/ja/orphaned/web/api/parentnode/queryselectorall/index.html @@ -0,0 +1,164 @@ +--- +title: ParentNode.querySelectorAll() +slug: orphaned/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 +original_slug: Web/API/ParentNode/querySelectorAll +--- +
{{ApiRef("DOM")}}
+ +

{{domxref("ParentNode")}} ミックスインは querySelectorAll() メソッドを定義しており、メソッド呼び出しの時点でそのオブジェクトの子孫にあたる要素のうち、一連のセレクターに一致するもののリストを示す {{domxref("NodeList")}} を返します。

+ +

単一の結果のみが必要な場合は、代わりに {{domxref("ParentNode.querySelector", "querySelector()")}} メソッドを使用することを検討してください。

+ +
+

メモ: このメソッドは {{domxref("Element.querySelectorAll()")}}, {{domxref("Document.querySelectorAll()")}}, {{domxref("DocumentFragment.querySelectorAll()")}} として実装されています。

+
+ +

構文

+ +
elementList = parentNode.querySelectorAll(selectors);
+
+ +

引数

+ +
+
selectors
+
マッチのための 1 つまたは複数のセレクターを含む {{domxref("DOMString")}}。この文字列は妥当な CSS セレクターでなければならず、そうでない場合は SyntaxError 例外がスローされます。セレクターの仕様と要素の識別の詳細は、セレクターを使用した DOM 要素の指定を参照してください。複数のセレクターを指定する際は、カンマで区切ります。
+
+ +
+

メモ: 標準の CSS 構文の一部ではない文字は、バックスラッシュ文字を使ってエスケープしなければなりません。 JavaScript でもバックスラッシュによるエスケープが使われているため、これらの文字を使った文字列リテラルを記述する際は、特に注意する必要があります。詳細は {{anch("Escaping special characters")}} を参照してください。

+
+ +

返値

+ +

生きていない {{domxref("NodeList")}} で、指定されたセレクターの1つ以上に一致する子孫ノード1つに対して1つずつの {{domxref("Element")}} を含みます。

+ +
+

メモ: 指定された selectors が CSS 擬似要素を含む場合、返されるリストは常に空になります。

+
+ +

例外

+ +
+
SyntaxError
+
指定された selectors の構文が妥当ではない。
+
+ +

例

+ +

文書内のすべての {{HTMLElement("p")}} 要素の {{domxref("NodeList")}} を入手します。

+ +
var matches = document.querySelectorAll("p");
+ +

次の例では、文書内にある note または alert のいずれかのクラスを持つ、すべての {{HTMLElement("div")}} 要素のリストを返します。

+ +
var matches = document.querySelectorAll("div.note, div.alert");
+
+ +

次に、 test という ID を持つコンテナ内に位置し、直接の親要素が highlighted クラスを持つ {{HTMLElement("div")}} である、<p> 要素のリストを取得します。

+ +
var container = document.querySelector("#test");
+var matches = container.querySelectorAll("div.highlighted > p");
+ +

次の例では属性セレクターを使用しており、 data-src という名前の属性を持つ、文書内の {{HTMLElement("iframe")}} 要素のリストを返します。

+ +
var matches = document.querySelectorAll("iframe[data-src]");
+ +

次の例では、ID が userlist の要素の中にあり、data-active 属性を持ち、その値が 1 であるリスト項目のリストを返すため、属性セレクターが使用されています。

+ +
var container = document.querySelector("#userlist");
+var matches = container.querySelectorAll("li[data-active=1]");
+ +

ユーザーのメモ

+ +

querySelectorAll() は、最も一般的な JavaScript DOM ライブラリと異なる動作を持ち、意図しない結果をもたらすことがあります。

+ +

HTML

+ +

次の、入れ子になった 3 つの {{HTMLElement("div")}} ブロックを持つ HTML について検討します。

+ +
<div class="outer">
+  <div class="select">
+    <div class="inner">
+    </div>
+  </div>
+</div>
+ +

JavaScript

+ +
var select = document.querySelector('.select');
+var inner = select.querySelectorAll('.outer .inner');
+inner.length; // 1 です。0 ではありません!
+
+ +

この例では、select class を持つ <div> の文脈で .outer .inner を選択するとき、.outer が基準となる要素（.select で検索される）の子孫ではないにもかかわらず、.inner class を持つ要素が見つけられています。querySelectorAll() はデフォルトでは、セレクターの最後の要素が検索スコープに含まれているかどうかのみ検証します。

+ +

{{cssxref(":scope")}} 擬似クラスを使うと、基準となる要素の子孫だけが一致するようになり、期待される挙動を取り戻すことができます。

+ +
var select = document.querySelector('.select');
+var inner = select.querySelectorAll(':scope .outer .inner');
+inner.length; // 0
+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("DOM WHATWG", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}{{Spec2("DOM WHATWG")}}Living standard
{{SpecName("Selectors API Level 2", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}{{Spec2("Selectors API Level 2")}}変更なし
{{SpecName("DOM4", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}{{Spec2("DOM4")}}初回定義
{{SpecName("Selectors API Level 1", "#interface-definitions", "document.querySelector()")}}{{Spec2("Selectors API Level 1")}}元の定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.ParentNode.querySelectorAll")}}

+ +

関連情報

+ + diff --git a/files/ja/orphaned/web/api/svgtransformable/index.html b/files/ja/orphaned/web/api/svgtransformable/index.html new file mode 100644 index 0000000000..5c69dccf39 --- /dev/null +++ b/files/ja/orphaned/web/api/svgtransformable/index.html @@ -0,0 +1,74 @@ +--- +title: SVGTransformable +slug: orphaned/Web/API/SVGTransformable +tags: + - API + - NeedsExample + - Reference + - Référence(2) + - SVG + - SVG DOM +translation_of: Web/API/SVGTransformable +original_slug: Web/API/SVGTransformable +--- +
{{APIRef("SVG")}}
+ +

SVG transformable interface

+ +

インターフェイス SVGTransformable には、属性 {{ SVGAttr("transform") }}. を持つ全ての要素に適用されるプロパティとメソッドが含まれています。

+ +

インターフェイスの概要

+ + + + + + + + + + + + + + + + + + + + +
Also implement無し
Methods無し
Properties +
    +
  • 読み取り専用 {{ domxref("SVGAnimatedTransformList") }} transform
    • +
+
Normative documentSVG 1.1 (2nd Edition)
+ +

プロパティ

+ + + + + + + + + + + + + + + + +
名前型説明
transform{{ domxref("SVGAnimatedTransformList") }}指定された要素の属性 {{ SVGAttr("transform") }} に対応します。
+ +

メソッド

+ +

SVGTransformable インターフェイスは、特定のメソッドを提供しません。

+ +

ブラウザー実装状況

+ + + +

{{Compat("api.SVGTransformable")}}

-- cgit v1.2.3-54-g00ecf