jQuery 中十个非常有用的遍历函数（译）

行使jQuery，可以很轻易的选择HTML元素。但有些时辰，在HTML布局较为伟大时，提炼我们选择的元素就是一件贫困的工作。在这篇教程中，我们将切磋十种要领去精辟和扩展我们将要操纵的荟萃。

HTML

起首，让我们看看下图表现的简朴的页面，通过这个教程我们将选择这些元素。

div.container是包裹元素；

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

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

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

为什么要遍历？

“为什么我们要进一步提炼一系列元素，莫非是jQuery选择语法不足强盛？”

好，让我们从示例开始。在上面提到的网页中，当一个star被点击时，我们必要给它以及左边的每个star添加class“on”。与此同时，我们要改变全部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。

（编辑：河北网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!