[Edge]。→
element の子孫要素の中で、指定されたセレクター群に一致する最初の要素を返します。
| element | Element。 |
|---|---|
| selectors | 照合するセレクター群を表す文字列です。これは有効な CSS 構文でなければなりません。セレクターが複数ある場合はカンマ「,」を含めてください。"セレクター1, セレクター2, …"
|
要素オブジェクト。または、一致するものが見つからなかったら null。
mdn： element の子孫要素のうち、selectors で指定されたセレクター群に一致するものを返します。照合の際には、element とその子孫を含む要素群の外にあるものも含めて、要素の階層全体を考慮します。言い換えると、selectors はまず element ではなく、文書全体に適用され、候補となる要素の初期リストが生成されます。その結果得られた要素が、element の子孫であるかどうかが調べられます。それらの残りの要素のうち、最初に一致したものが querySelector() メソッドによって返されます。
HTML：
<SPAN class=Test>[SPAN要素1]</SPAN> <SPAN id=IdTest>[SPAN要素2<B class=Test>[B要素]</B>テキスト<EM>[EM要素<I class=Test>[I要素]</I>]</EM>]</SPAN>
JavaScript：
D=IdTest.querySelector(".Test"); //＝[object]：[object HTMLElement]
//title＝[string]：
//lang＝[string]：
//…
//offsetTop＝[number]：1211
//offsetLeft＝[number]：264
//offsetWidth＝[number]：72
//offsetHeight＝[number]：19
//innerText＝[string]：[B要素]
//…
HTML：
<SPAN id=IdTest>[SPAN要素2<B class=Test2>[B要素]</B>テキスト<EM>[EM要素<I class=Test>[I要素]</I>]</EM>]</SPAN>
JavaScript： selectors のセレクターを複数指定。
D=IdTest.querySelector(".Test, Test2"); //＝[object]：[object HTMLElement]
//title＝[string]：
//lang＝[string]：
//…
//offsetTop＝[number]：1668
//offsetLeft＝[number]：355
//offsetWidth＝[number]：60
//offsetHeight＝[number]：19
//innerText＝[string]：[I要素]
//…
selectors の複数指定は、"第1候補, 第2候補, …"？。