使用filter()基于父元素过滤jquery

Question

我在jquery文档中看到，我可以使用.parent()来根据父元素过滤匹配的元素。但是在这个过程中，我得到的最终结果是父元素的集合，而不是最初的元素集合。所以我可以使用滤镜来达到我想要的效果。但是我发现很少有关于如何使用过滤器来基于父过滤器的文档。

例如，我的html是:

<div id="social">
    <a href="www.facebook.com">Facebook</a><br/>
    <a href="www.twitter.com">Twitter</a><br/>
</div>
<div id="topsites">
    <a href="www.facebook.com">Facebook</a><br/>
    <a href="stackoverflow.com">Stack Overflow</a><br/>
</div>

我想要得到一组元素，它由<a>标签组成，在它的href属性中有facebook，但在socialdiv父元素中。

我猜代码应该是这样的:

$('a[href*="facebook"]').filter( ... ).click(function() {
});

但是我完全不知道在滤镜上放什么。"parent#social"吗?

另一种方式是使用过滤器函数

$('a[href*="facebook"]').filter(function(index) {
    return ...
}
.click(function() {
});

我也不知道什么代码放在... .是this.parent.id == "social"之类的东西吗?如果可能的话，我更喜欢第一种形式，但如果解决方案只能通过使用第二种形式(过滤函数)来实现，那么就可以了。非常感谢。

Answer 1

.parent()不过滤，它遍历。它接受一个jQuery对象，该对象列出一个数组(大小为[0,n))，并生成一个包含每个元素父元素的jQuery对象。

获取一个jQuery对象与你正在寻找的列表是更简单的，虽然…

CSS选择器，jQuery所基于的(有各种扩展)本质上是分层的。这意味着选择某些父(s)的特定子(s)是相当琐碎的。选择你想要的元素的CSS选择器是:

#social a[href*="facebook"]

如果你在jQuery构造函数中使用这个，你会得到object:

$('#social a[href*="facebook"]')

Answer 2

我想得到一组元素，其中包括<a>标签，有facebook在它的href属性，但在socialdiv父母。

这里不需要filter，

$('#social a[href*="facebook"]')

。