如果时间在晚上 7 点到早上 7 点之间，Javascript 会这样做吗？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18031410/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Javascript if time is between 7pm and 7am do this?
提问by Yanlu
I want to have a javascript file which checks if current time is between 7pm and 7am. If so it should change the background color on my website to X. If the current time is not between 7pm and 7am the background color should be Y. Since I am new to Javascript I do not know everything, and that's why I need your help!
我想要一个 javascript 文件来检查当前时间是否在晚上 7 点到早上 7 点之间。如果是这样，它应该将我网站上的背景颜色更改为 X。如果当前时间不在晚上 7 点到早上 7 点之间，则背景颜色应该是 Y。由于我是 Javascript 新手，我不知道一切，这就是为什么我需要你的帮助！
回答by Nev
回答by Austin Brunkhorst
I suggest using a class on the body to manage the style, but handle the classes in JavaScript.
我建议在 body 上使用一个类来管理样式，但在 JavaScript 中处理这些类。
Essentially you'll use the Dateclass to get the current hour in military time (24 hour). 7 PM is represented as 19 in military time.
本质上，您将使用Date类获取军用时间（24 小时）中的当前小时数。7 PM 在军用时间表示为 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';
}
Then in CSS you can handle those classes.
然后在 CSS 中你可以处理这些类。
body.between7 {
background-color: green;
}
body.notBetween7 {
background-color: red;
}
回答by Naveen Kumar Alonekar
回答by Spencer
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
}
回答by Butani Vijay
This may be help you :
这可能会帮助你：
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
}
}
回答by Fourat
You have to wrap it in DOMContentLoadedevent so it's fired before CSS and images etc...
您必须将其包装在DOMContentLoaded事件中，以便在 CSS 和图像等之前触发它...
The DOMContentLoaded event is fired when the initial HTML document has been completely loaded and parsed, without waiting for stylesheets, images, and subframes to finish loading
DOMContentLoaded 事件在初始 HTML 文档完全加载和解析后触发，无需等待样式表、图像和子框架完成加载
Ref : https://developer.mozilla.org/en-US/docs/Web/Events/DOMContentLoaded
参考：https: //developer.mozilla.org/en-US/docs/Web/Events/DOMContentLoaded
Event listener :
事件监听器：
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
});
