Jquery, select 具有相同 class 的所有锚点之后的第一个下一个元素

Question

我想 select 在所有具有相同 class 的锚点之后的第一个下一个元素。
HTML

<a class="some_anchors">
</a>
<ul id="ul_1">
</ul>
...
<a class="some_anchors">
</a>
<ul id="ul_2">
</ul>
...
<a class="some_anchors">
</a>
<ul id="ul_3">
</ul>
...
<a class="some_anchors">
</a>
<ul id="ul_4">
</ul>
...

现在我想 select 所有 ul1,ul2,ul3,ul4。
我在这里试过：

console.log($(".some_anchors").nextAll('ul:first'));

但它 returns ul1 而已。
如何解决这个问题？

Answer 1

您可以使用下一个兄弟选择器 + 直接在 class 元素之后定位 ul。

console.log(
  $('.some_anchors + ul').get()
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a class="some_anchors">
</a>
<ul id="ul_1">
</ul>
<ul class="not-me">
</ul>

<a class="some_anchors">
</a>
<ul id="ul_2">
</ul>
<ul class="not-me">
</ul>

<a class="some_anchors">
</a>
<ul id="ul_3">
</ul>
<ul class="not-me">
</ul>

<a class="some_anchors">
</a>
<ul id="ul_4">
</ul>
<ul class="not-me">
</ul>

Answer 2

我觉得可能对你有帮助

  $('li').each(function () {
        if ($(this).hasClass("some_anchors")) {
            $(this).show();

        } else {
            $(this).hide();
        }
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div style="width:500px;" class="siblings">
  <ul>
    <li>li (No Class)</li>
    <li>li (No Class)</li>
    <li>li (No Class)</li>
    <li class="some_anchors">li (sibling with class name "some_anchors")</li>
    <li>li (No Class)</li>
    <li>li (No Class)</li>
  </ul>   
</div>

Answer 3

使用以下内容：

$(function() {
  var lists = [];
  $(".some_anchors").each(function(i, el) {
    lists.push($(el).next());
  });
  console.log(lists);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a class="some_anchors">
</a>
<ul id="ul_1">
</ul>

<a class="some_anchors">
</a>
<ul id="ul_2">
</ul>

<a class="some_anchors">
</a>
<ul id="ul_3">
</ul>

<a class="some_anchors">
</a>
<ul id="ul_4">
</ul>

Jquery, select 具有相同 class 的所有锚点之后的第一个下一个元素

Jquery, select first next element after all anchors with same class

jquery

selector

next