jquery - 选择子集中的第一个

Question

我有一个像这样的 DOM；

<li></li>
<li class="this"></li>
<li class="this"></li>
<li></li>
<li></li>
<li class="this"></li>
<li class="this"></li>
<li class="this"></li>
<li></li>
<li class="this"></li>
<li></li>
<li></li>

我只想选择每个连续thises系列中的第一个li。

因此，如果我将 .addClass("that") 应用于此选择器的对象，生成的 DOM 将如下所示；

<li></li>
<li class="this that"></li>
<li class="this"></li>
<li></li>
<li></li>
<li class="this that"></li>
<li class="this"></li>
<li class="this"></li>
<li></li>
<li class="this that"></li>
<li></li>
<li></li>

实现这种效果的最有效方法是什么？我无法添加或删除 DOM 中的任何元素(因此，例如将连续的系列包装在它们自己的包装器 div 中是不可能的)。

提前非常感谢!

Answer 1

这行得通吗？

$("li:not(.this) + .this").addClass('that');

编辑:如果第一项是 this 类，那将不起作用，您将需要这个(如果适用):

$("li:not(.this) + .this, .this:first-of-type").addClass('that');