第 N 个孩子和祖父母或第二级孩子

Question

这可能很简单但是想不通！

我有这样的代码：

<div class="grandparent">
    <div class="parent">
        <div class="child" id="1"></div>
        <div class="child" id="2"></div>
        <div class="child" id="3"></div>
        <div class="child" id="4"></div>
    </div> 
    <div class="parent">
        <div class="child" id="5"></div>
        <div class="child" id="6"></div>
    </div> 
</div>

我试过了：

$('.grandparent .child:nth-child(3n)').css("margin-right","0px");

所以我需要 child #3 和 child #6 拥有 margin-right:0px。

但它总是将 .parent 称为 3n 孩子，而不是选定的类 .grandparent，因此只有 child #3 受到影响.

知道解决这个问题的简单方法吗？

Answer 1

我建议：

$('.grandparent .child').filter(function(i){
    return (i+1)%3 === 0;
}).css('margin-right', '0px');

JS Fiddle proof-of-concept（使用color 使其更易于查看）。

参考资料：

• filter()。