使用javascript在循环中动态更改包装器背景，并具有自定义延迟

我想在一个无限循环中更改页面背景，在javascript的帮助下，在每次更改之间有一个自定义的延迟。 我遇到了一些问题：

当我首先在没有循环的情况下测试它时，出于某种原因，两个函数同时启动：

setTimeout(myFunction_1, 3000);
setTimeout(myFunction_2, 3000);

function myFunction_1(){                
document.getElementById("wrapper").style.background = "green";
console.log("test 1");
}

function myFunction_2(){                
document.getElementById("wrapper").style.background = "yellow";
console.log("test 2");
}

当我添加循环时：

while (1 == 1){
setTimeout(myFunction_1, 3000);
setTimeout(myFunction_2, 3000);
}

它会使浏览器崩溃

---

如何在自定义时间间隔的循环中更改背景而不使浏览器崩溃？

看来你不熟悉js，最好先深入了解一下

您应按以下方式更改代码：

myFunction_1();

function myFunction_1(){                
    document.getElementById("wrapper").style.background = "green";
    console.log("test 1");
    setTimeout(function(){
        myFunction_2();
    },3000);
}

function myFunction_2(){                
    document.getElementById("wrapper").style.background = "yellow";
    console.log("test 2");
    setTimeout(function(){
        myFunction_3();
    },3000);
}

function myFunction_3(){                
    document.getElementById("wrapper").style.background = "blue";
    console.log("test 3");
    setTimeout(function(){
        myFunction_1();
    },3000);
}

---

如果我有N个背景，我能以类似的方式将它们全部链接起来吗？我更改了代码以适应三个函数。你最好给出一个数据数组或其他东西来显示你是如何组织你的颜色和时间间隔的。因此，我可以决定代码的体系结构。我的数据在php数组中，javascript将使用php动态创建。我想我可以用你给我的东西。你说得对，我是js新手，刚刚开始学习：）