我正在使用Vanilla JS实现倒计时,我想知道如何确保每次刷新页面时都不会重置。
我在这里想念什么吗?就目前而言,每次我重新加载页面时,它将重置为30天。
const countDownClock = (number = 100, format = 'seconds') => {
const daysElement = document.querySelector('.days');
const hoursElement = document.querySelector('.hours');
const minutesElement = document.querySelector('.minutes');
const secondsElement = document.querySelector('.seconds');
let countdown;
convertFormat(format);
function convertFormat(format) {
switch (format) {
case 'seconds':
return timer(number);
case 'minutes':
return timer(number * 60);
case 'hours':
return timer(number * 60 * 60);
case 'days':
return timer(number * 60 * 60 * 24);
}
}
function timer(seconds) {
const now = Date.now();
const then = now + seconds * 1000;
countdown = setInterval(() => {
const secondsLeft = Math.round((then - Date.now()) / 1000);
if (secondsLeft <= 0) {
clearInterval(countdown);
return;
};
displayTimeLeft(secondsLeft);
}, 1000);
}
function displayTimeLeft(seconds) {
daysElement.textContent = Math.floor(seconds / 86400);
hoursElement.textContent = Math.floor((seconds % 86400) / 3600);
minutesElement.textContent = Math.floor((seconds % 86400) % 3600 / 60);
secondsElement.textContent = seconds % 60 < 10 ? `0${seconds % 60}` : seconds % 60;
}
}
countDownClock(30, 'days');