jquery，按类查找下一个元素答案

【问题标题】：jquery, find next element by classjquery，按类查找下一个元素
【发布时间】：2011-04-09 20:48:21
【问题描述】：

如何按类查找下一个元素。

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

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

这可能吗？

【问题讨论】：

标签： jquery class element next

【解决方案1】：

在这种情况下你需要上<tr>然后使用.next()，像这样：

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

或者如果中间可能有没有.class 的行，您可以使用.nextAll()，如下所示：

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

【讨论】：

这样做会更容易：$(obj).closest('tr').nextAll('.class')[0];
@StuR - 在这里行不通，因为 .nextAll() 只查看兄弟元素。您需要一些查看后代的东西来找到问题想要的下一个
。
如果想从返回的 HTMLObject 中获取属性怎么办？喜欢$(obj).closest('tr').nextAll('.class')[0].attr('data-attribute');
如果元素没有兄弟元素，你可能还需要使用：.parent().next("")
@NickCraver 你太棒了

【解决方案2】：

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

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

【讨论】：

【解决方案3】：

在这种情况下，您不能使用 next()，如果您查看 documentation，它会说：
Next() 获取匹配元素集中的 每个元素的紧随其后的兄弟 。如果提供了选择器，它会检索与选择器匹配的下一个兄弟。

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


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

但既然不是，我看不出使用 next() 的意义。您可以改为编码：


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

【讨论】：

但是它如何找到下一个元素。 .find 将返回所有元素。
你得到了拥有两个元素的父元素，现在你可以搜索你想要的元素。我只是帮了我

【解决方案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"});

【讨论】：

【解决方案5】：

通过标签名查找下一个元素

  function findNext(start, tag)
    {
      while(start.nodeName !== tag)
      {
            start = start.nextElementSibling;
      }
      return start;
    }

【讨论】：