| 構文 |
内容 |
使用例 |
| $('*') |
全ての要素を指定 |
$('*') |
| $('{要素名}') |
一致する要素(a, divなど)を指定 |
$('input') inputタグを指定 |
| $('.{class名}') |
class属性に指定したクラス名が含まれる要素を指定 |
$(.content) class="content"を指定 |
| $('#{id}') |
id属性が指定したidに一致する要素を指定 |
$('#apple') id="apple"を指定 |
| $('[{属性}]') |
特定の属性を持つ要素を指定 |
$('[data-hoge]') data-hoge属性を指定 |
| $('[{属性}="{値}"]') |
特定の属性(値)を持つ要素を指定 ※ワイルドカード検索も可能 |
$('[type="checkbox"]') チェックボックスを指定 |
| 構文 |
内容 |
使用例 |
| $('EF') |
EかつFに一致する要素を指定 |
$('div.content') 下記test1を指定 |
| $('E, F') |
E または Fに一致する要素を指定 |
$('[name="test1"], [name="test2"]') 下記test1とtest2を指定 |
| $('E F') |
E配下のFに一致する要素を指定 |
$('div.content p') 下記test2とtest3直下のpタグを指定 |
| $('E > F') |
E直下のFに一致する要素を指定 |
$('div.content > p') 下記test2を指定 |
| $('E + F') |
Eの一つ後ろにある要素を指定 |
$('[name="test2"] + div') 下記test3を指定 |
| $('E ~ F') |
Eの後ろにある全ての要素を指定 |
$('[name="test2"] ~ div') 下記test3,4を指定 |
| $(':checked') |
選択中のラジオボタン、チェックボックスを指定 |
$("input[name='hoge']:checked") 下記のid="one"のラジオボタンを指定 |
<div name="test1" class="content">
<p name="test2">
test1の直下・配下
</p>
<div name="test3">
test1の直下・配下
test2に隣接
test2の後ろ
<p >
test1の配下
test3の直下・配下
</p>
</div>
<div name="test4">
test1の直下・配下
test2の後ろ
</div>
</div>
<div name="test5">
<input type="radio" id="one" name="hoge" value="1" checked>チェックされてる方</input>
<input type="radio" id="two" name="hoge" value="2">チェックされてない方</input>
</div>
