W3.JSセレクター


W3.JSセレクター

W3.JSはHTML要素を選択し、選択した要素に対してアクションを実行します。

w3.action(selector)
  • アクション()は、選択した要素に対して実行されます
  • セレクター)はHTML要素を選択します

w3.hide('p')  // Hide all <p> elements

CSSセレクターに精通していますか?

W3.JSは、CSS構文を使用してHTML要素を選択および操作します。

セレクターは、タグ名、ID、クラス、タイプ、属性、属性の値などに基づいてHTML要素を「検索」(選択)するために使用されます。すべてのセレクターのリストは、CSSセレクターリファレンスにあります。


セレクターの例

HTML要素を選択するには、タグ名を使用します。

すべての<h2>要素を非表示にします。

w3.hide('h2')

特定のIDを持つ要素を選択するには、ハッシュ文字を記述し、その後にHTML要素のIDを記述します。

id = "London"で要素を非表示にします:

w3.hide('#London')

特定のクラスの要素を選択するには、ピリオド文字を入力し、その後にクラスの名前を入力します。

class = "city"ですべての要素を非表示にします:

w3.hide('.city')


その他のセレクターの例

Selector Description Example
("*") Selects all elements in the document
(this) Selects the current HTML element
("p.intro") Selects all <p> elements with class="intro"
("div p") Selects all <p> element inside all <div> elements
("div p:first-child") Selects the first <p> element inside all <div> elements
("[href]") Selects all elements with an href attribute
("a[target=_blank]") Selects all <a> elements with a target attribute value equal to "_blank"
("p:nth-child(even)") Selects all even <p> elements

すべてのCSSセレクターの完全なリファレンスについては、 CSSセレクターリファレンスにアクセスしてください