如果时间是晚上7点到早上7点之间的Javascript吗?

时间:2013-08-03 09:35:44

标签: javascript if-statement time action

我想要一个javascript文件,检查当前时间是否在晚上7点到早上7点之间。如果是这样,它应该将我网站上的背景颜色更改为X. 如果当前时间不在晚上7点到早上7点之间,则背景颜色应为Y. 由于我是Javascript的新手,我不知道一切,这就是我需要你帮助的原因!

6 个答案:

答案 0 :(得分:21)

var today = new Date().getHours();
if (today >= 7 && today <= 19) {
   document.body.style.background = "Red";
} else {
    document.body.style.background = "Blue";
}

请参阅fiddle

答案 1 :(得分:1)

这是JSBin

var currentTime = new Date().getHours();
if (currentTime >= 19 && currentTime <= 7) {
   document.body.style.background = "/*your X color*/";
} else {
    document.body.style.background = "/*your Y color*/";
}

答案 2 :(得分:1)

我建议在正文上使用一个类来管理样式,但是用JavaScript处理这些类。

基本上,您将使用 Date 类来获取军事时间(24小时)的当前小时数。下午7点在军事时间表示为19。

var hour = new Date().getHours();

// between 7 PM and 7 AM respectively
if(hour >= 19 || hour <= 7) {
    document.body.className += 'between7';
} else {
    document.body.className += 'notBetween7';
}

然后在CSS中你可以处理这些类。

body.between7 {
    background-color: green;
}

body.notBetween7 {
    background-color: red;
}

答案 3 :(得分:0)

var d = new Date();
var n = d.getHours(); //get the current local time's hour in military time (1..23)

//If the time is greater than or equal to 7pm or less than or equal to 7am
if (n >= 19 || n <= 7) { 
   //set background color to X
}
else {
   //set background color to Y
}

答案 4 :(得分:-1)

这可能会对您有所帮助:

 function checkTime() {
        var d = new Date(); // current time
        var hours = d.getHours();
        var mins = d.getMinutes();
         if(hours>=19 || hours <=7)
          {
              document.body.style.background="";//set background color x
          }
          else
          {
               document.body.style.background="";//set background color y
          }

  }

答案 5 :(得分:-1)

您必须将其包装在DOMContentLoaded事件中,以便在CSS和图像等之前将其触发...

  

当初始HTML文档包含以下内容时,将触发DOMContentLoaded事件   完全加载和解析,无需等待样式表,   图像和子帧完成加载

Ref:https://developer.mozilla.org/en-US/docs/Web/Events/DOMContentLoaded

事件监听器:

document.addEventListener("DOMContentLoaded", function(event) {
    var currentHour = new Date().getHours();
    var themeClassName = (currentHour >= 19 || currentHour <= 7) ? "night-class-name" : "day-class-name";
    document.body.className += themeClassName
});