JavaScript中CSS更改的问题

我正在尝试通过JavaScript进行CSS更改。我有一个测验网站，当用户标记正确的选项时，该选项将变为绿色，当用户标记错误的选项时，该选项将变为红色，但我必须更改颜色并将用户重定向到另一个页面，但是CSS更改非常慢，并且在某些时候不起作用。这是我的代码：

CSS:

。选择{
空白：正常；
单词包装：打断单词；
利润率：20px；
宽度：计算（40%+100px）；
高度：计算（10%+10px）；
边框样式：实心；
边框颜色：rgba（0,0,0,0.4）；
边界半径：7px；
背景色：rgba（255255,0.6）；
光标：指针；
字体大小：20px；
过渡：0.4s；
}

JS:

功能睡眠（毫秒）{
var d=新日期（）；
var d2=null；
do{d2=新日期（）；}
d2-d

当您更改DOM中的某些内容（在本例中为背景色）时，JavaScript将在其处理的事件完成之前不会更新屏幕

这是因为JavaScript只在一个线程中运行——它不可能在同一时间循环并重新显示您的背景颜色！它需要先完成循环

您应该尝试使用

setTimeout（）

，而不是尝试实现在单线程javascript环境中永远无法正常工作的“sleep”函数

---

与其一次又一次地循环直到时间结束，在一个非常简单的级别上，这更像是在JavaScript引擎内设置一个内部“唤醒警报”，在3000毫秒后将关闭，并告诉JavaScript运行其中的代码。在这种情况下，要调用

window.location.redirect

，我建议删除sleep函数，因为它会阻止整个页面/脚本运行。您可以使用

setInterval（）

在离开页面之前等待三秒钟。谢谢，现在我的代码正在运行，我将完成主题：）

function govariable(page,variable,valor,id,color) {
    document.getElementById(id).style.backgroundColor = color
    setTimeout(function() {
        window.location.replace(`${page}?${variable}=${valor}`)
    }, 3000);
}