Question

我想在早上6点，中午12点和下午6点更新问候语。我正在寻找最有效的方法，而不是在循环内过于频繁地轮询当前时间。

setInterval(function(){
    var now = new Date();
    if(now.getHours() == 6 && now.getMinutes() == 0 && now.getSeconds() == 0){
        document.getElementById('greeting').innerHTML = "Good Morning";
    } else if (now.getHours() == 12 && now.getMinutes() == 0 && now.getSeconds() == 0){
        document.getElementById('greeting').innerHTML = "Good Afternoon";
    } else if (now.getHours() == 18 && now.getMinutes() == 0 && now.getSeconds() == 0){
        document.getElementById('greeting').innerHTML = "Good Evening";
    }   
},3600000);

如上所示，我的直接解决方案是每小时轮询当前时间。你可以想象，这里有很多浪费的处理，只需要在24小时内更新3次。此外，如果页面在一小时中加载，那么它将错过更新。

Answer 1

您的代码看起来像这样：

function updateTime() {
  var now = new Date();

  //display the greeting message base on the hour range
  if (now.getHours() >= 6 && now.getHours() < 12) {
    document.getElementById('greeting').innerHTML = "Good Morning";
  } else if (now.getHours() > 12 && now.getHours() < 18) {
    document.getElementById('greeting').innerHTML = "Good Afternoon";
  } else if (now.getHours() >= 18 || now.getHours() < 6) {
    document.getElementById('greeting').innerHTML = "Good Evening";
  }

  //do the next check to the next full hour and 1 minute
  setTimeout(updateTime, (60 - now.getMinutes() + 1) * 60 * 1000);
}


updateTime();

每小时发生的使用过的CPU负载可以忽略不计。

根据时间更新html

1 个答案: