Jquery 查找伪第n个子项以应用CSS更改

我有一个项目列表，左边浮动，右边距为20px。每4个项目没有右边距，因此，列表项目排列成4列。为此，我使用CSS

nth child（4n）

选择器来选择列表项

这一切都很好，然后我决定通过jquery同位素插件应用过滤，这会把事情搞得一团糟。每四个项目仍然没有右边距，但这适用于列表中的每个项目

我需要做的是找出屏幕上的第四个孩子，并应用CSS规则。我相信这可能是由其他java实现的

---

如果显示任何代码、CSS HTML或jQuery都会有帮助，请告诉我是什么。任何帮助都将不胜感激。

使用Jquery的方法是只计算

：可见的
元素，然后应用sytle，如下所示：

$(document).ready(function(){
    $('div:visible').each(function (i) {
      if ((i+1) % 4 == 0) $(this).css('marginRight','0');
    });
})

您只需要更改选择器并将其放置在所需的正确处理程序中

查看此演示。
这比听起来更难

n个子项
和
n个类型
选择器不能通过元素是否可见来区分，甚至不能通过检查其他选择器来区分（例如，不能通过查看类名来区分）

使用第n个子元素（4n）
，您将始终获得作为所选父元素的子元素的第四/第八/etc元素；除了按类型（
nth of type
）之外，无法对其进行进一步筛选

使用第n个类型（4n）

是相同的，但按所选元素的元素类型过滤。（例如，如果选择一个

div

，则

nth类型（4n）

将为您提供集合中的第4/8个/etc

div

元素，忽略任何

span

s等）

有一个可以满足您所需的功能，但不幸的是，它在任何浏览器中都不受支持，而且看起来也不会很快出现

那么，我们如何在现有的浏览器中实现您想要的功能呢

• 简单的选择是从DOM中删除隐藏的元素，而不是简单地隐藏它们。然后您现有的

  nth-child（）

  选择器将正常工作。当然，如果您需要将它们进行切换，这并不理想，但这是一个选项

• 使用Javascript而不是CSS来选择元素。当您更改任何可见元素的可见性时，可能会在（4n）可见元素上切换类名或其他内容

• 查找实现

  nth-match（）

  选择器的polyfill库

---

要在屏幕上找到第四个孩子

这是没有隐藏的元素还是在可用的浏览器大小中不可见？从同位素中筛选将所有其他元素标记为CSS元素

显示：无我会给他们每边留10px的边距，然后留一个边距：-10px；在容器上。可能是@Paulie_D的副本。我确实看到了该解决方案，但是，它不起作用，因此我提出了这个问题。这似乎起作用了……几乎。通过同位素过滤器切换时，添加的类保持不变。如果有什么帮助的话，这里是网站：@NWTech这个问题不能满足你的需要，如果你检查代码，你可以看到每个图像都有一个绝对位置。。。。那么边距和空间无关。答案是有效的，因为你看到你得到的是正确的价值边际0，但对于你不能做到的位置that@NWTech当同位素的函数运行时，您可能需要包含此代码。我认为您的解决方案可能会起作用，如果有办法删除
margin right:0，单击筛选按钮时。FWIW，我的
项具有一类“项目”。当我尝试你的建议时，我将
div:visible
替换为
.projects:visible
，但我注意到右边的
边距为：0应用于每4个项目，无论它是否可见…这可能是因为在页面加载时，每个项目都会显示，并且当切换过滤器时，边距不会重置？