为什么我们要进一步提炼一系列元素，难道是jQuery选择语法不够强大？让我们从示例开始。在下面提到的网页中，当一个star被点击时，我们需要给它以及左边的每个star添加class“on”。首先，让我们看看下图所示的简单的页面，通过这个教程我们将选择这些元素。

51CTO推荐专题：jQuery从入门到精通

◆div.container是包裹元素；

◆div.photo、div.title、div.rating是div.container的直接子级；

◆每个div.star是div.rating的子级；

◆当div.satr的class为“on”时，它是一个完整的star。

与此同时，我们要改变所有star父元素的背景颜色，因此，我们的代码如下：

$('.star').click(function(){  
 
         $(this).addClass('on');  
 
//       如何选取当前对象的 父元素?  
 
//       如何获得当前star左侧所有的star?  
 
});  

在第二行，我们得到了我们点击的当前对象。但是，如 何得到stars的父级？即div.rating。但是，在一个页面中，有很多div.rating。哪一个是我们想要的？如何获得“this”左边所有 的star？可喜的是，jQuery允许我们基于这些基层关系，在现存集合的基础上获得新的元素集合。而这些正是遍历函数发挥作用的地方。

1、children

这个函数得到一组元素的直接子级。

在很多情况下会很方便，看看下面这张图：

◆开始的时候容器中的star全部被选择；

◆给children()传递一个选择表 达式将选择结果缩小至选中的star；

◆如果chilidren()每接受任何 参数，将返回所有直接子级；

◆不返回孙级元素。

2、filter

这个函数通过传递的选择表达式从一个集合中过滤元素。任何不匹配这个表达式的元素将从选择的集合中移除。

下面的这个例子直截了当。从 5个star中过滤出class为“on”的star。

3、not

与filter恰恰相 反，not()从集合中移除匹配的元素。看下面这个例子。偶数列的star从选择集合中移除，留下的是奇数行的star。

“ 注意：'Even'和'odd'选择器是从0开始的，从0开始计数，不是从1。”

4、add

如果我们想在集合中增加一些元素怎么办？add()函 数正是做这件事的。同样简单明了，photo盒 子被添加到集合中。