选择元素以后，可以使用 jQuery 提供的方法利用元素在文档结构里的关系进行选择 … 比如找出它的子元素，父元素，或者得上一个和下一个兄弟 … 这些方法里可以使用选择器作为它参数 … 这样我们就有可能找到元素的指定类型的子元素，或者父元素 …

下面我们去试一下这些方法 …

$( '#christmas' )

可以先选择拥有christmas 这个 ID 的元素 .. 也就是这个 li 元素 …

找出这个元素里的子元素 … 用的是 .children() 这个方法 …

$( '#christmas' ).children()

它的子元素是一个 img 元素.. 还有一个 h6 元素 … 如果我们只关心里面的 h6 元素 … 可以给 children() 方法传递一个选择器 …

$( '#christmas' ).children( 'h6' )

结果就是它的 h6 类型的子元素 … 我们也可以定位元素的父元素 … 用的是 parent() 这个方法

$( '#christmas' ).children( 'h6' ).parent();

h6 元素的父元素是这个 li 元素 … 另外还有一个 parents() 方法 … 可以选择出所有的父元素 …

想去定位 Christmas 的下一个兄弟 .. 可以使用 .next()

$( '#christmas' ).next()

找到它的上一个兄弟，用的是 .prev() 这个方法

$( '#christmas' ).prev()

选择它的所有的兄弟，可以调用 .siblings() …

为了更清楚一点，我们给它的兄弟们都添加个边框的样式 …

$( '#christmas' ).siblings().addClass( 'border' )

除了 christmas 以外，它的兄弟们都有这个边框的样式 …

.nextAll() 可以只选择它后面的所有的兄弟 …

（#刷新）

$( '#christmas' ).nextAll().addClass( 'border' )

还有个 .prevAll() 方法，可以选择在它前面的所有的兄弟 ..

$( '#christmas' ).prevAll().addClass( 'border' )