Javascript 带递归函数的旋转木马

我正在尝试使用递归函数使这个旋转木马工作。假设我在CSS上定义了三个类，并附加了转换（默认、屏幕上、屏幕外）。我的想法是从默认设置中调用图像，在图像上添加一个动态类，然后将其发送到屏幕外和返回队列中。图像的数量是4。旋转木马一直在工作，直到我添加了使旋转木马永远运行所需的条件语句

我调用了索引为0的moveKitties函数，但不知何故，该函数在0之后不会一直调用自己。你知道有什么问题吗

(function() {

    var kitty = document.querySelectorAll(".kitty-container img");
      
    function moveKitties(n) {
        kitty[n].classList.remove("onscreen");
        kitty[n].classList.add("offscreen");
        if (n === 3) {
            kitty[0].classList.add("onscreen");
            setTimeout(function () {
                moveKitties(0);
            }, 3000);
        } else {
            kitty[n+1].classList.add("onscreen");
            setTimeout(function () {
                moveKitties(n);
            }, 3000);
        }
    }

    document.addEventListener("transitionend", function(e) {
        if (e.target.style.right == 0) {
            // console.log(e);
            e.target.classList.remove("offscreen");
        }
    });

    
    setTimeout(moveKitties(0), 3000);
})();

---

应

moveKitties（n）be
moveKitties（n+1）？不，我认为这不是问题所在。使用n+1，我将调用下一个图像为“屏幕上”，函数开始从“屏幕上”删除图像。是的，但您需要在下一次moveKitties（）迭代中以某种方式更改
n
的值，否则它将保持为代码末尾setTimeout（）调用设置的
0
。是的，是的。你是对的。我怎么看不见SSo，如果您将其更改为
n+1
它现在工作正常吗？