Javascript 查找数组中存在的下一个DOM对象

因此，我创建了一个包含特定类的所有实例的数组

anchors = [];

$('.a-all').each(function() {
    anchors.push($(this));
});

if ( viewport().width > 1366 ) {
    sub_anchors = $('.a-lg');
} else if ( viewport().width > 1024 ) {
    sub_anchors = $('.a-md');
} else if ( viewport().width > 768 ) {
    sub_anchors = $('.a-sm');
} else {
    sub_anchors = $('.a-xs');
}

sub_anchors.each(function() {
    anchors.push($(this));
});

然后我设置了一个变量“current”，并使其成为类为“.active”的对象

 current = $('.active');

现在，使用jQuery，我希望能够找到与.active相关的下一个和上一个DOM对象，该对象存在于我创建的数组中

数组不整齐，将以不同的宽度更改

这是可能的，还是这里有更好的逻辑

编辑：为上下文添加标记

<div class="website-wrapper w-d-100 h-d-100">

    <div class="page-wrapper">

        <section id="landing-slider" class="a-all active">
            <div class="w-d-100 h-d-100">
                This is the homepage landing slider... thing.
            </div>
        </section>

        <section id="about" class="a-all">
            <div class="w-d-100 h-d-50 w-sm-75 h-sm-100 dark">
                About Panel 1 (75)
            </div>
            <div class="w-d-100 h-d-50 w-sm-25 h-sm-100">
                About Panel 2 (25)
            </div>
        </section>

        <section id="clients" class="a-all">
            <div class="w-d-100 h-d-50 w-sm-50 h-sm-100">
                Clients Panel 1 (50)
            </div>
            <div class="w-d-100 h-d-50 w-sm-50 h-sm-100 dark">
                Clients Panel 2 (50)
            </div>
        </section>

        <section id="services" class="a-md">
            <section class="a-sm">
                <div class="w-d-100 h-d-100 w-sm-50 h-sm-100 dark">
                    Services Panel 1 (50)
                </div>
            </section>
            <section class="a-sm">
                <div class="w-d-100 h-d-100 w-sm-50 h-sm-100">
                    Services Panel 2 (50)
                </div>
            </section>
        </section>

        <section id="lets-work" class="a-all">
            <div class="w-d-100 h-d-100 dark">
                Lets work together! (100)
            </div>
        </section>

    </div>

</div>

这是主页登陆滑块。。。事情
关于小组1（75）
关于小组2（25）
客户小组1（50）
客户小组2（50）
服务小组1（50）
服务小组2（50）
让我们一起努力！(100)

更新的答案（现在您已经显示了HTML） 由于

.a-all

元素是同级元素（有时不相邻），因此可以使用

prevAll

和

nextAll

，根本不需要

锚定

数组：

var next = $(".active")..nextAll(".a-all").first();
// or
var previous = $(".active").prevAll(".a-all").first();

如果要查找

.a-md

或

.a-sm

，只需将其用作

preval

/

nextAll

选择器即可

原始答案 现在，使用jQuery，我希望能够找到与我创建的数组中存在的

.active

相关的下一个和上一个DOM对象

如果您不使用初始jQuery对象创建数组，那么就更容易了。相反，只需记住对象：

var anchors = $(".a-all");

稍后，如果您想知道元素在该数组中的位置，可以使用：

然后你可以像这样得到上一个：

var prev = index > 0 ? anchors.eq(index - 1) : $();

var next = index < anchors.length - 1 ? anchors.eq(index + 1) : $();

…或者下一个类似的例子：

var prev = index > 0 ? anchors.eq(index - 1) : $();

var next = index < anchors.length - 1 ? anchors.eq(index + 1) : $();

---

数组的用途是什么？你的HTML结构是什么？我确信不需要从jQuery对象构建数组也可以做到这一点。这就是为什么要创建一个

$（'.a-all'）

数组，而它本身基本上是一个类似数组的对象。注意：您可以使用将更多元素添加到collection@T.J.Crowder我也有同样的想法——我猜OP选择的元素并不都在同一个元素中和/或在该元素的同一级别。我添加了HTML。数组是我想要滚动的元素的集合。但是数组没有顺序，所以我不能滚动到下一个/prev数组条目，因为它可能不是页面上的下一个/prev对象。我还想在某些宽度上找到其他类，例如“a-md”和“a-sm”。@KillahB：如果你想使用它们，请参阅答案顶部的更新，只需在

prevAll

或

nextAll

中使用它们。很抱歉，需要在不同类的元素之间进行导航。所以，我认为我不能使用类选择器来查找元素。@KillahB：我不知道你的意思。你能解释一下吗？有时候我的数组会像这样

[.a-all、.a-all、.a-all、.a-all、.a-all]

，有时候它会像这样

[.a-all、.a-all、.a-all、.a-all、.a-sm]

，可能还有其他变体。我希望能够（按顺序）导航到所有这些对象。不是按数组的顺序，而是按它们在dom中出现的顺序。