よく利用されるセレクターを紹介しましたが、他にも沢山の使えるセレクターがあります!
紹介しきれなかったセレクターを一覧でまとめてみました
名称:書式 | 指定対象 |
---|---|
子セレクター:$("親要素名" > "子要素名") | 特定の要素のすぐ下の子要素を選択命令 |
隣接セレクター:$("要素1+要素2") | 特定の要素の次に出てくる要素を選択命令 |
first-child疑似クラス:$("要素:first-child") | 特定のセレクターの最初に登場する要素を選択命令 |
名称:書式 | 指定対象 |
---|---|
間接セレクター:$("要素1〜要素2") | 特定の要素の後に出現する要素 |
否定疑似クラス:$("要素1:not(要素2)") | 特定の要素の内要素2つの条件を除く要素 |
empty疑似クラス:$("要素:empty") | 子要素やテキストを含まない要素 |
nth-child疑似クラス:$("要素:nht-child(番号)") | 要素内の指定した番号の要素 |
last-child疑似クラス:$("要素:last-child") | 特定の要素が1つだけ含まれる要素 |
only-child疑似クラス:$("要素:only-child") | 要素内を後ろから教えて指定した番号にある要素 |
nth-last-child疑似クラス:$("要素:nth-last-child(番号)") | 同一要素で指定した番号にある要素 |
nth-of-type疑似クラス:$("要素:nth-last-of-type(番号)”) | 同一要素で後ろから教えて指定した番号にある要素 |
first-of-type疑似クラス:$(”要素:first-of-type”) | 同一要素で最初にあたる要素 |
last-of-type疑似クラス:$("要素:last-of-type") | 同一要素で最後にあたる要素 |
only-of-type疑似クラス:$("要素:only-of-type") | 1つだけ存在する要素 |
lang疑似クラス:$(":lang(言語)") | 特定の言語を指定された要素 |
名称:書式 | 指定対象 |
---|---|
[attribute]:$("[属性名]") | 特定の属性をもつ要素 |
[attribute=’value’]:$("[属性名='値']") | 特定の属性が指定した値を持つ要素 |
[attribute!=’value’]:$("要素名[属性名!='値']") | 特定の属性が指定した値を持たない要素 |
[attribute^=’value’]:$("[属性名^='値']") | 特定の属性が指定した値で始まっている要素 |
[attribute$=’value’]:$("[属性名$='値']") | 特定の属性が指定した値で終わっている要素 |
[attribute*=’value’]:$("[属性名*='値']") | 特定の属性が指定した値を含んでいる要素 |
[attributeFilter1] [attributeFilter2] :$("[属性セレクター1][属性セレクタ-2]") |
複数の属性セレクターに該当する要素 |
名称:書式 | 指定対象 |
---|---|
firstセレクター:$("要素:first") | 指定した要素の最初の要素 |
lastセレクター:$("要素:last") | 指定した要素の最後の要素 |
evenセレクター:$("要素:even") | 指定した最後の偶数番目の要素(0から数える) |
oddセレクター:$("要素:odd") | 指定した要素の奇数番目の要素(0から数える) |
eqセレクター:$("要素:eq(番号)") | 指定した番号の要素(番号は0から教える) |
ltセレクター:$("要素:lt(番号)") | 指定した番号より前の要素(番号は0から教える) |
gtセレクター:$("要素:gt(番号)") | 指定した番号より後の要素(番号は0から教える) |
headerセレクター:$(".header") | h1〜h6までのheading要素 |
containsセレクター:$("要素:contains(文字列)") | 特定の文字列が含まれている要素 |
hasセレクター:$("要素1:has(要素2)") | 特定の要素が含まれている要素 |
parentセレクター:$("要素:parent") | 子要素やテキストを含む要素 |