セレクターでHTMLの要素を取り出す

jQueryでは、セレクターでHTMLのどの要素を操作するか指定して、メソッドで操作する内容を記述する。

<ul>
    <li>あいうえお</li>
</ul>
$(function(){
    $("li").css("color","red");
});

よく使うセレクター

名称	書式	指定対象
要素セレクター	$("要素名")	特定の要素
IDセレクター	$("#ID名")	特定のID属性を持つ要素
クラスセレクタ	$(".クラス名")	特定のclass属性を持つ要素
子孫セレクター	$("要素 要素")	特定の要素の内側にある要素
ユニバーサルセレクタ	$("*")	全ての要素
グループセレクタ	$("セレクター1,セレクター2,...")	複数のセレクター
子セレクター	$("親要素名>子要素名")	特定の要素の直下の子要素
隣接セレクター	$("要素1+要素2")	特定の要素の次のセレクター
first-child擬似クラス	$("要素:first-child")	同一要素内の最初の要素
間接セレクター	$("要素1~要素2")	特定の要素の後に出現する要素
否定擬似クラス	$("要素1:not(要素2)")	特定の要素のうち要素の2の条件を除く要素
empty擬似クラス	$("要素:empty")	子要素やテキストを含まない要素
nth-child擬似クラス	$("要素:nth-child(番号)")	特定の要素のうち指定した番号の要素
last-child擬似クラス	$("要素:last-child")	同一要素内の最後の要素
only-child擬似クラス	$("要素:only-child")	特定の要素が1つだけ含まれる要素
[attribute]	$("[属性名]")	特定の属性を持つ要素
[attribute='value']	$("[属性名='値']")	特定の要素が指定した値を持つ要素
[attribute!='value']	$("要素名[属性名!='値']")	特定の属性が指定した値を持たない要素
[attribute^='value']	$("[属性名^='値']")	特定の属性が指定した値で始まっている要素
[attribute$='value']	$("[属性名$='値']")	特定の属性が指定した値で終わっている要素
[attribute*='value']	$("[属性名*='値']")	特定の属性が指定した値を含んでいる要素
[attributeFilter1][attributeFilter2]	$("[属性セレクター1][属性セレクター2]")	複数の属性セレクターに該当する要素
firstフィルター	$("要素:first")	指定した要素の最初の要素
lastフィルター	$("要素:last")	指定した要素の最後の要素
evenフィルター	$("要素:even")	指定した要素の偶数番目の要素
oddフィルター	$("要素:odd")	指定した要素の奇数番目の要素
eqフィルター	$("要素:eq(番号)")	指定した番号の要素
gtフィルター	$("要素:gt(番号)")	指定した番号より後の要素
ltフィルター	$("要素:lt(番号)")	指定した番号より前の要素
headerフィルター	$("要素:header")	h1からh6までのheading要素
containsフィルター	$("要素:contains(文字列)")	特定の文字列が含まれている要素
hasフィルター	$("要素1:has(要素2)")	特定の要素が含まれている要素
parentフィルター	$("要素:parent")	子要素やテキストを含む要素