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セレクターリファレンスにアクセスしてください。