40-解决方案

选择背景色：黄橙洋红淡粉水蓝草绿白色选择字体：宋体黑体微软雅黑楷体选择字体大小：小中大特恢复默认

1.9.2　解决方案

jQuery提供一组方法，可以根据当前选择的DOM元素的上下文遍历DOM。

例如，查看如下的HTML片段：

<div>
<ul>
<li><a href="#">link</a></li>
<li><a href="#">link</a></li>
<li><a href="#">link</a></li>
<li><a href="#">link</a></li>
</ul>
</div>

现在，用 :eq() 索引自定义选择器选择第2个 <li> 元素：

//根据索引选择<li>集合中的第2个元素,索引从0开始
jQuery('li:eq(1)');

现在有一个上下文——HTML结构中的一个出发点。出发点是第2个

元素。从这里开始，可以到达任何位置——对，几乎任何位置。

让我们来看看，使用几个jQuery提供的DOM遍历方法能够到达哪里。代码中的注释就能说明问题：

jQuery('li:eq(1)').next() //选择第三个<li>
jQuery('li:eq(1)').prev() //选择第一个<li>
jQuery('li:eq(1)').parent() //选择<ul>
jQuery('li:eq(1)').parent().children() //选择所有<li>
jQuery('li:eq(1)').nextAll() //选择第二个<li>之后的所有<li>
jQuery('li:eq(1)').prevAll() //选择第二个<li>之前的所有<li>

记住，这些遍历方法产生新的包装器集，使用 end() 可以返回前一个包装器集。

Previous 上一篇本节目录 Next 下一篇

40-解决方案

1.9.2 解决方案

1.9.2　解决方案