jquery - 在当前集合中添加下一个项目和下一个项目之后的项目

Question

想象一下下面的 HTML

<div id="outer">
    <div id="elem1"></div>
    <div class="helperBtn"></div>
    <div class="helperBtn"></div>

    <div id="elem2"></div>
    <div class="helperBtn"></div>
    <div class="helperBtn"></div>

    <div id="elem3"></div>
    <div class="helperBtn"></div>
    <div class="helperBtn"></div>
</div>

如何选择 elem2 并且两者都遵循 div.helperBtn 的？
我尝试过这样的方法: $('#elem2').add(':next') 但无法获得任何有效的解决方案。
有什么想法吗？

Answer 1

根据您的情况，您可以使用 nextUntil()与 addBack() :

var elements = $("#elem2").nextUntil("#elem3").addBack();

以上将匹配 #elem2 和 #elem3 之间的所有元素，然后将 #elem2 添加回集合中。生成的 jQuery 对象将包含三个元素。

编辑:我在另一个答案中看到了关于此解决方案被硬编码的合理担忧。确实如此，但它可以轻松修改，因此您只需指定第一个元素:

var elements = $("#elem2").nextUntil(":not(.helperBtn)").addBack();