因?yàn)镈OM的結(jié)構(gòu)就是層級(jí)結(jié)構(gòu)，所以我們經(jīng)常要根據(jù)層級(jí)關(guān)系進(jìn)行選擇
層級(jí)選擇器（Descendant Selector）
層級(jí)選擇器相比單個(gè)的選擇器好處在于，它縮小了選擇范圍，因?yàn)槭紫纫ㄎ桓腹?jié)點(diǎn)，才能選擇相應(yīng)的子節(jié)點(diǎn)，這樣避免了頁(yè)面其他不相關(guān)的元素。
如果兩個(gè)DOM元素具有層級(jí)關(guān)系，就可以用$('ancestor descendant')來(lái)選擇，層級(jí)之間用空格隔開(kāi)
<!-- HTML結(jié)構(gòu) -->
<div class="testing">
<ul class="name">
<li class="name-mazy">Mazy</li>
<li class="name-eric">Eric</li>
<li class="name-vivian">Vivian</li>
</ul>
</div>
要選出 Vivian，可以用層級(jí)選擇器：
$('ul.name li.name-vivian'); // [<li class="name-vivian">Vivian</li>]
$('div.testing li.name-vivian'); // [<li class="name-vivian">Vivian</li>]
選擇所有的<li>節(jié)點(diǎn)
$('ul.name li');
子選擇器（Child Selector）
子選擇器
$('parent>child')類似層級(jí)選擇器，但是限定了層級(jí)關(guān)系必須是父子關(guān)系，就是<child>節(jié)點(diǎn)必須是<parent>節(jié)點(diǎn)的直屬子節(jié)點(diǎn)
$('ul.name>li.name-mazy'); // 可以選出[<li class="name-mazy">Mazy</li>]
$('div.testing>li.name-mazy'); // [], 無(wú)法選出，因?yàn)?lt;div>和<li>不構(gòu)成父子關(guān)系
過(guò)濾器（Filter）
過(guò)濾器一般不單獨(dú)使用，它通常附加在選擇器上，幫助我們更精確地定位元素
$('ul.name li'); // 選出JavaScript、Python和Lua 3個(gè)節(jié)點(diǎn)
$('ul.name li:first-child'); // Mazy
$('ul.name li:last-child'); // 僅選出Vivian
$('ul.name li:nth-child(2)'); // 選出第N個(gè)元素，N從1開(kāi)始
$('ul.name li:nth-child(even)'); // 選出序號(hào)為偶數(shù)的元素
$('ul.name li:nth-child(odd)'); // 選出序號(hào)為奇數(shù)的元素
表單相關(guān)
針對(duì)表單元素，jQuery還有一組特殊的選擇器：
:input：可以選擇<input>，<textarea>，<select>和<button>；:file：可以選擇<input type="file">，和input[type=file]一樣；:checkbox：可以選擇復(fù)選框，和input[type=checkbox]一樣；:radio：可以選擇單選框，和input[type=radio]一樣；:focus：可以選擇當(dāng)前輸入焦點(diǎn)的元素，例如把光標(biāo)放到一個(gè)<input>上，用$('input:focus')就可以選出；:checked：選擇當(dāng)前勾上的單選框和復(fù)選框，用這個(gè)選擇器可以立刻獲得用戶選擇的項(xiàng)目，如$('input[type=radio]:checked')；:enabled：可以選擇可以正常輸入的<input>、<select>
等，也就是沒(méi)有灰掉的輸入；:disabled：和:enabled正好相反，選擇那些不能輸入的。
此外，jQuery還有很多有用的選擇器，例如，選出可見(jiàn)的或隱藏的元素：
$('div:visible'); // 所有可見(jiàn)的div
$('div:hidden'); // 所有隱藏的div
