从静态变化到实时变革

Question

我有一个Javascript代码，我用它来根据一天中的时间更改某些元素的外观。

我的问题是：是否有办法让这些外观更改在页面上可以“实时”显示，而无需人员重新加载/刷新网页？

<script type="text/javascript">
function getDayTime(hours) {
if (hours > 20 || hours < 5)
return "night";

if (hours > 17)
return "dusk";

if (hours > 8)
return "day";

return "dawn";
}

$(function() {
document.body.className = getDayTime(new Date().getHours());
});
</script>

Answer 1

您可以使用setInterval()每x毫秒更新一次值。例如：

setInterval(function() {
    document.body.className = getDayTime(new Date().getHours());
}, 1000); // update every second