从静态变化到动态变化

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