JavaScript时钟：时间间隔冲突

Question

您好，我是编程新手，正在研究 JavaScript 时钟。我让它根据是偶数分钟还是奇数分钟更改背景颜色，并且它每小时更改一次文本颜色。但是，我在集成第三个任务时遇到了麻烦：我试图让它每五分钟更改一次随机颜色，从而覆盖偶数或奇数语句。所以第 1 分钟：奇数，第 2 分钟：偶数，3：奇数，4：偶数，5：随机颜色。

自每五分钟更改一次背景颜色的功能 (lines 75 to 83) is set on an interval, that conflicts with the interval set for getting the date (line 71)。

就目前而言，任务 2 和 3 的效果在任务 1 被注释掉之前是不可见的。有没有办法将任务 1 与第 11-24 行的 if/else 语句结合起来，以便我的所有任务可以同时运行？

Answer 1

使用一个定时器函数来执行所有事件。要获得更准确的计时，请将您的计时器设置为每 100 毫秒执行一次并维护一个计数器。根据计数器值，您可以在不同的时间间隔执行特定任务，还可以检查时间间隔是否重叠。当计数器达到您需要跟踪的最大间隔时，可以重置计数器。

这是一个示例：

var counter = 0;
var oldsec = 0;
setInterval(function(){timerInt()}, 100);

function timerInt(){
    // Read system clock and get seconds
    if (seconds <> oldsec) {
        // Update clock time here and set oldsec=seconds
    }


    // Execute other tasks
    if (counter % 3000 == 0) {  // Executes once every 5 minutes (300*10)

    }
    else if (counter % 1200 == 0) {  // Executes once in 2 minutes (120*10)

    }
    else if (counter % 600 == 0) {  // Executes once a minute (60*10)

    }

    counter += 1;
    if (counter == 3000) counter = 0;
}

您可以使用if和else来控制要执行的任务。您的时钟秒数更新也将更加准确，不会像使用 1000 毫秒计时器那样 "skip" 秒。

JavaScript时钟：时间间隔冲突

JavaScript clock: time interval conflicts

javascript

clock

setinterval