Javascript 幻灯片放映逻辑中的代码块不'；无法在页面加载时运行

我试图用纯javascript制作一个简单的文本幻灯片。以下是我目前的代码：

let currentChangingText = 0;
function changeText() {
    if (currentChangingText == changingTextsLength) currentChangingText = 0;
    $changingTexts[currentChangingText].setAttribute("class", "changing-text changing-text-slide-in");

    setTimeout(function() {
        setTimeout(function() { // *
            $changingTexts[currentChangingText].classList.remove("changing-text-slide-in");
            $changingTexts[currentChangingText].classList.add("changing-text-slide-out");
        }, 1000);

        $changingTexts[currentChangingText].classList.add("changing-text-hide");
        ++currentChangingText;
        changeText();
    }, 2000);
}

它“起作用了”，但我注意到了一些奇怪的事情。在第一次迭代中（加载页面时），我用

*

标记的代码块根本不运行，因此滑出效果将不适用。在下一次迭代中，它工作良好（滑出效果适用）。我不知道是什么原因造成的，任何帮助都将不胜感激（另外，如果你知道更好的方法，也请告诉我！）。提前谢谢

---

前2000毫秒没有任何事情发生，因为您延迟了它

setTimeout(function() { // this is delay to load+2000
   setTimeout(function() { //you effectively delay this to load+3000
      //part1
   }, 1000);
   //part2
}, 2000);

你要么单独推迟

setTimeout(part1,1000)
setTimeout(part2,2000)

或者正确地嵌套它们

setTimeout({part1, setTimeout(part2,1000)},1000)

---

也许会把你引向正确的方向。你所说的迭代是什么意思？@appleapple好吧，2000毫秒后，

changeText（）

函数将再次被调用。我用

*

标记的代码块不会在第一次函数调用时运行（由

DOMContentLoaded

事件触发（我也尝试了

load

事件，仍然相同），在呈现DOM后会运行吗？@Shomz是的，我尝试了

DOMContentLoaded

和

load

事件，仍然相同