Javascript 忽略选择器中第n个子元素的不可见元素

我有一个

元素的列表，我正在使用

：n个child

以第三个和第四个元素的特定子元素为目标，并给它们一个额外的类

。对

但是，当我隐藏一些元素（比如，第一个或第二个列表项）时，它无法正常工作。我只想将类“right”添加到可见列表项的子级。我该怎么做

这是我正在使用的代码：

$(".ilist:visible:nth-child(4n+3)").find(".window").addClass("right");
$(".ilist:visible:nth-child(4n+4)").find(".window").addClass("right");

我删除了所有类

。正确的

，如下所示：

$(".ilist .window.right").removeClass("right");

HTML结构：

<ul>
   <li class="ilist">
      ...
      <div class="name">Name (Search works with it)</div>
      <div class="window"></div>
   </li>

   ...
</ul>

...
名称（搜索使用它）

...

隐藏元素的事实不会更改其在DOM树中的位置，因此如果隐藏任何同级列表项，则第n个子元素（4n+3）不会更改

当您切换某些元素列表项的可见性时，您必须重置

右侧的

类，并重新应用到相应的元素

您可以通过将函数传递给

addClass

，而不是新的类名来实现这一点。此函数将接收匹配元素的索引作为第一个参数，您可以使用它检查它是第三个还是第四个。如果是，则返回要应用的新类名：

$(".ilist .window.right").removeClass("right");
$(".ilist:visible .window").addClass(function(i, currentClass){
    return (i == 2 || i == 3) ? "right" : "";
});

---

要将类添加到每个第n个可见列表项的子项中，您可以首先查找所有可见列表项，然后按其在集合中的排名对其进行筛选：

$(".ilist:visible").filter(function(index){
    return (index % 4 == 0) || (index % 4 == 3);
}).find(".window").addClass("right");

---

你的问题还不完全清楚。“使用搜索”时会发生什么？你的HTML结构是什么？“不能正常工作”是什么意思？当我使用搜索时，然后添加类。正确的工作方式是随机的。例如，如果元素是8，那么只有一个将获得类。对。什么是“搜索”？它是元素吗？您的

.window

元素是第n个子元素本身还是其后代？当您需要

.is（）

时，可能您正在使用

.find（）

。那么我如何为每个可见的第三和第四元素指定一个特殊类呢？