jquery，按类查找下一个元素

Question

我如何按类找到下一个元素。

我尝试使用$(obj).next('.class');但这仅返回$(obj)父级中的类。 我需要按类名在整个代码中的任何位置使用下一个元素。 因为我的代码看起来像

<table>
<tr><td><div class="class">First</div></td></tr>
<tr><td><div class="class">Second</div></td></tr>
</table>

这可能吗？

Answer 1

在这种情况下，您需要前往<tr> 然后使用.next()，如下所示：

$(obj).closest('tr').next().find('.class');

如果内部没有.class，可能会有中间行，您可以使用.nextAll()，如下所示：

$(obj).closest('tr').nextAll(':has(.class):first').find('.class');

Answer 2

要查找具有相同类的下一个元素：

$(".class").eq( $(".class").index( $(element) ) + 1 )

Answer 3

在这种情况下你不能使用next（），如果你看 documentation ，它会说：
下一步（）在匹配元素集合中，在每个元素 的兄弟之后立即获取 。如果提供了选择器，它将检索与选择器匹配的下一个兄弟。

所以，如果第二个DIV在同一个TD中，那么你可以编码：

// Won't work in your case
$(obj).next().filter('.class');

但由于事实并非如此，我认为没有必要使用next（）。您可以改为编码：

$(obj).parents('table').find('.class')

Answer 4

给出第一个选择器： SelectorA ，您可以找到 SelectorB 的下一个匹配项，如下所示：

将鼠标悬停以更改边框的示例：

$("SelectorA").on("mouseover", function() {
    var i = $(this).find("SelectorB")[0];
    $(i).css({"border" : "1px"});
    });
}

使用示例更改边框：

var i = $("SelectorA").find("SelectorB")[0];
$(i).css({"border" : "1px"});