javascript - 获取for循环中的前一个元素

Question

编辑2(使问题更容易理解)

我试图实现的效果如下:每次元素进入视口(viewport)时，都会向其中添加“is-visible”类，并从前一个元素中删除相同的“is-visible”类。

现在我已经成功使其工作，但在添加 is-visible 之前，我运行了 for 循环来删除所有 is-visible 类code> 类到视口(viewport)中的元素。

它可以工作，但就性能而言，我认为最好从 element[i -1] 中删除该类。这是我无法让它工作的。

这是我尝试使 element[i-1] 解决方案工作的简化 fiddle :https://jsfiddle.net/epigeyre/vm36fpuo/11/ .

<小时/>

编辑1(回答一些提出的问题)

我通过使用模运算符 ((i+len-1)%len) 纠正了 @Catalin Iancu 提出的问题(非常感谢您的宝贵帮助)。

<小时/>

原始问题(不太清楚)

我试图使用以下代码获取 for 循环中的前一个元素(以更改其类):

for (var i = 0; i < array.length; i++) {
    if(array[i-1] && my other conditions) {
        array[i-1].classList.remove('is-visible');
        array[i].classList.add('is-visible');
    }
}

但它并没有删除 [i-1] 元素的类。

这是我的模块的一段更完整的代码(它在 scroll 事件监听器中运行):

var services = document.getElementsByClassName('services'),
    contRect = servicesContainer.getBoundingClientRect();

for (var i = 0; i < services.length; i++) {
    var serviceRect = services[i].getBoundingClientRect();

    if ( !services[i].classList.contains('active') && Math.round(serviceRect.left) < contRect.right && services[i-1]) {
        services[i-1].classList.remove('is-visible');
        services[i].classList.add('is-visible');
    }
}

感谢您的帮助!

Answer 1

您的 if(array[i-1] && my other criteria) 始终为真，除了第一种情况 array[-1] 不为真存在。因此，它将删除然后添加每个元素的 active 类，这将使其看起来好像只删除了第一个元素的类。

当不再需要循环时，您需要的是更好的 if 条件或 break 语句

for (var i = 0; i < array.length; i++) {
    if(array[i] && i != array.length - 1) {
        array[i].classList.remove('active');
    }
}
array[array.length - 1].classList.add('active');