結合選擇器

考慮遵循 DOM 結構

<ul class="parentUl">
    <li> Level 1
        <ul class="childUl">
            <li>Level 1-1 <span> Item - 1 </span></li>
            <li>Level 1-1 <span> Item - 2 </span></li>
        </ul>
    </li>
    <li> Level 2
        <ul class="childUl">
            <li>Level 2-1 <span> Item - 1 </span></li>
            <li>Level 2-1 <span> Item - 1 </span></li>
        </ul>
    </li>
</ul>

後裔和兒童選擇者

鑑於父母 <ul> - parentUl 找到它的後代（<li>），

1. 簡單的 $('parent child')

   >> $('ul.parentUl li')

   這將使指定祖先的所有匹配後代都降低。

2. > - $('parent > child')

   >> $('ul.parentUl > li')

   這將找到所有匹配的子項（ 僅限第一級 ）。

3. 基於上下文的選擇器 - $('child','parent')

   >> $('li','ul.parentUl')

   這與上面的 1.相同。

4. find() - $('parent').find('child')

   >> $('ul.parentUl').find('li')

   這與上面的 1.相同。

5. children() - $('parent').find('child')

   >> $('ul.parentUl').children('li')

   這與上面的 2.相同。

其他組合器

組選擇器：“，”

選擇所有 <ul> 元素和所有 <li> 元素和所有 <span> 元素：

$('ul, li, span')

倍數選擇器：“”（無字元）

選擇所有 <ul> 元素與 parentUl 類：

$('ul.parentUl')

相鄰的兄弟選擇器：“+”

選擇緊跟在另一個 <li> 元素之後的所有 <li> 元素：

$('li + li')

一般兄弟選擇器：“〜”

選擇所有 <li> 元素作為其他 <li> 元素的兄弟元素：

$('li ~ li')