從靜態更改到實時更改

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