基於一天中的時間觸發javascript事件

Question

我在尋找幫助，以查看是否有一種簡單快捷的方式來根據一天網站在瀏覽器中打開的時間來觸發JS事件。

本質上我想要做的是在下午5點到凌晨5點之間的用戶本地時區有此腳本觸發。該腳本目前連接到一個按鈕，只需將頁面主體的類翻轉爲「夜間模式」即可。我希望兩者協調工作，基於時間進行自動化，並且如果您想要黑暗或光明主題，可以使用按鈕進行覆蓋。

function toggleClass(element, className) { 
if (!element || !className) { 
    return; 
} 
var classString = element.className, 
    nameIndex = classString.indexOf(className); 
if (nameIndex == -1) { 
    classString += ' ' + className; 
} else { 
    classString = classString.substr(0, nameIndex) + classString.substr(nameIndex + className.length); 
} 
element.className = classString; 
} 

document.getElementById('day-btn').addEventListener('click', function() { 
    toggleClass(document.getElementById('body'), 'night'); 
}); 

https://jsfiddle.net/simpson/57xe333n/2/

Answer 1

var time = new Date(); 
element = document.getElementById('body'); 
className = "night"; 
console.log(time.getHours()); 
if(time.getHours() > 17 || time.getHours < 5) { 
    if (!element || !className) { 
     return; 
    } 
    var classString = element.className, 
     nameIndex = classString.indexOf(className); 
    if (nameIndex == -1) { 
     classString += ' ' + className; 
    } else { 
     classString = classString.substr(0, nameIndex) + classString.substr(nameIndex + className.length); 
    } 
    element.className = classString; 
} 

這使用JS內置的日期功能從系統中提取。它運行一個返回int（0-23）的getHours（）函數。 if語句(time.getHours() > 17 || time.getHours < 5)將僅運行代碼並在主題爲5pm之後或5am之前更改主題。希望這可以讓你開始。