Javascript 旋转木马-如何通过元素循环？

我试图找出如何一次一个循环遍历每个列表元素，并在它们运行时对它们应用函数，我尝试了几种方法，一些提示会有所帮助

HTML结构

<div class="custom-item">
  <ul>
    <li id="first-slide" class="slide active"><h1>Test</h1></li>
    <li id="second-slide" class="slide"><h1>Test</h1></li>
    <li id="third-slide" class="slide"><h1>Test</h1></li>
  </ul>
</div>

---

我添加了一个css类，以便您可以看到正在切换的活动类。您用于检查、添加和删除类的方法未写入，因此由于脚本错误而失败。看看我在下面使用classList属性做了什么。然而，从你的文章标题来看，我不确定你是否想在每一篇文章上都停顿一下，然后继续。在这种情况下，javascript setInterval方法可能就是您想要的工具

$（文档）.ready（函数（）{
$（“.custom item”）.find（“.slide”）.each（函数（）{
如果（！this.classList.contains（“active”））{
this.classList.add（“活动”）；
}否则{
此.classList.remove（“活动”）；
}
});
});
.active{
背景色：红色；
}


测试
测试
测试

您需要使用$（this）.hasClass来检查“活动”类

JSFiddle


JavaScript

$(document).ready(function() {
            $( ".slide" ).each(function( i ) {
                if ( $(this).hasClass("active") ) {
                    $(this).removeClass('active');
                    $(this).addClass("changed");
                } else {
                    $(this).addClass("active");
                }
            });
        });

CSS

.active {
    color: red;
}
.changed {
    color: blue;
}

循环将检查元素是否具有“active”类，并将其替换为“changed”。反之亦然。
修复：

你在正确的轨道上，你会找到答案的。（最好删除这个）是的，你可能会得到很多重复的问题标志。有很多选择。您说过其他选项“如果不重写大量代码，对我来说是不可执行的”。那么，在这里，你期望得到什么样的答案呢？可能我们提供的任何代码都需要您重写一点。也许重新问你的问题是为了更“可回答”。@Jonathan谢谢，没有机会得到更清晰的提示了吗？@philtune在这个阶段，我试图找出如何一次一个地循环每个列表元素，并在它们运行时对其应用函数，我会在问题中反映出来。
.active {
    color: red;
}
.changed {
    color: blue;
}

  $(document).ready(function() {

            $('.slide').each(function(i) {
                if ( !$(this).hasClass("active")) {
                    $(this).addClass("active");
                } else {
                    $(this).removeClass("active");
                }
            });
        });