3

这是我的代码：

<div class="parent">
    <div class="child">&nbsp;</div>            
    <div class="child">&nbsp;</div>
    <div class="child">&nbsp;</div>
    <div class="child">&nbsp;</div>    
</div>

<div class="parent">
    <div class="child">&nbsp;</div>            
    <div class="child">&nbsp;</div>
    <div class="child">&nbsp;</div>
</div>

$('.child').each(function() {
    $(this).parent().addClass('childParent');
    console.log("step");
});?

但正如你所看到的，它是addClass7 次，这是没有必要的。是否可以减少每一步？事实上，在这个例子中，addClass只需要两次就足够了。

4

4 回答 4

14

是的：只需调用.parent()集合即可。元素不会在 jQuery 集合中重复

$('.child').parent().addClass('childParent');
于 2012-10-12T14:29:42.577 回答
3

.each()请注意，其他答案的方法更好，但如果您出于任何原因确实需要保持通话，这是一种替代方法。

您可以使用:first-child选择器来确保.child每个父级只选择一个元素：

$('.child:first-child').each(function() {
    $(this).parent().addClass('childParent');
    console.log("step");
});

现在，它只会选择 2 个元素（.child每个元素中的第一个.parent元素），因此.each()调用将只有两个元素可以迭代。

于 2012-10-12T14:28:31.810 回答
1

您是否有理由不直接引用父母？

$('div.parent').addClass('childParent');
于 2012-10-12T14:32:00.803 回答
0

虽然您可以调用每个孩子，然后让 jquery 使用独特的方法，但它可能不是最有效的使用方法。例如，如果每个父母有 10 个孩子，这意味着选择每个孩子需要 10 倍或更长的时间，然后检查它是否是唯一的。

相反，只选择父母来限制您的初始选择，然后使用“has()”方法过滤那些父母。看起来像这样：

$('div.parent:has(div.child)').addClass('childParent');
于 2012-10-18T15:00:31.240 回答