这里首先介绍一下jQuery的另一类选择器：层次选择器。
如果想通过DOM元素之间的层次关系来获取特定元素，例如后代元素，子元素，相邻元素和兄弟元素等，那么都可以用到层次选择器，先大体介绍一下层次选择器的格式。
| 选择器 | 描述 | 返回 |
| $（”ancestor descendant”） | 选取ancestor元素里的所有descendant（后代）元素 | 集合元素 |
| $(“parent > child”) | 选取parent元素下的child(子)元素，与$（”ancestor descendant”）有区别，$（”ancestor descendant”）选择的是后代元素 | 集合元素 |
| $(‘prev + next’) | 选取紧接在prev元素后的next元素 | 集合元素 |
| $(‘prev ~ siblings’) | 选取prev元素之后的氖siblings元素 | 集合元素 |
简单举几个例子：
如果一个HTML代码如下所示：
- <div>父节点
- <p class="one">子节点DIV
- <span>孙节点</span>
- </p>
- <span>子节点SPAN</span>
- </div>
基本选择器的用法：
$(‘div span’) 可以选取DIC里所有的SPAN，是一个集合
$(‘div > span’) 可以选取DIV元素下标签名为span的元素，是一个集合
小提示！这里有一个需要注意的地方，很多人对以上这两者区别有些混淆，只有空格的选择器是把DIV下所有的SPAN元素都返回，无论是子节点还是孙节点，对于以上HTML代码来说，找到的就是2个元素，一个是”孙节点“，一个是”子节点SPAN“；而后者有个“>”符号的选择器，只是把DIV子节点中的SPAN元素返回，对于以上HTML代码来说就是1个元素，即“子节点SPAN”。
$(‘.one + span’) 可以选取class为”one”的下一个SPAN元素，也是一个集合
$(‘.one ~ span”) 可以选取class为”one”的后面的所有SPAN兄弟元素，也是一个集合
小提示！ 这里也有一个小提示，就是后面的这两个选择器在jQuery 中还有一个等价方法：
$(‘.one + span’) 等价于 $(‘.one’).next(‘span’)
$(‘.one ~ span”) 等价于 $(‘.one’).nextAll(‘span’)
这里再把$(‘#prev ~ siblings’)与siblings()做一个比较，前者的选择器只能选取“#prev”之后的同辈元素，而后者的选择器可以把所有的同辈元素都取到。