javascript - 根据时间显示不同的图像

Question

所以我有一个主页，其中包含一些代码来根据时间更改背景。我的问题是:它只检查页面首次加载的时间，我需要它不断检查。这是我的代码，请帮忙。

  var today2 = new Date();
  var h2 = today2.getHours();

  if (h2 > 18) {
      document.body.style.backgroundImage = "url('cityatnight2.jpg')";
  }    
  else if (h2 < 9) {
      document.body.style.backgroundImage = "url('sunrise2.jpg')";
  }  
  else {
      document.body.style.backgroundImage = "url('homescreen3.jpg')";
  }

Answer 1

我建议使用setInterval命令。它允许您指定代码以给定的时间间隔运行。例如，要每小时运行一次，您可以这样做:

function SetBackground()
{
    var today2 = new Date();
    var h2 = today2.getHours();

    if (h2 > 18) {
        document.body.style.backgroundImage = "url('cityatnight2.jpg')";
    }
    else if (h2 < 9) {
        document.body.style.backgroundImage = "url('sunrise2.jpg')";
    }
    else {
        document.body.style.backgroundImage = "url('homescreen3.jpg')";
    }
}

// 1 Hour Interval
window.setInterval(SetBackground, 60 * 60 * 1000);

在此处了解有关该功能的更多信息:https://www.w3schools.com/jsref/met_win_setinterval.asp