Таймер js setInterval

Question

Помогите разобраться почему setInterval не меняет значение часов/минут/секунд каждую секунду, а только первый раз при загрузки страницы.

    let deadline = '2020-04-21';

let t = Date.parse(deadline) - Date.parse(new Date()),
    seconds = Math.floor((t/1000) % 60),
    minutes = Math.floor((t/1000/60) % 60),
    hours = Math.floor((t/(1000*60*60)));

let timerH = document.querySelector(".hours"),
    timerM = document.querySelector(".minutes"),
    timerS = document.querySelector(".seconds");

function updateClock () {
    timerH.textContent = hours;
    timerM.textContent = minutes;
    timerS.textContent = seconds;
}

setInterval(updateClock, 1000);

Answer 1

Потому что дата считается у вас только при загрузке страницы, нужно её считать так же в setInterval

let deadline = '2020-04-21';

let timerH = document.querySelector(".hours"),
    timerM = document.querySelector(".minutes"),
    timerS = document.querySelector(".seconds");

function updateClock () {
    let t = Date.parse(deadline) - Date.parse(new Date()),
    seconds = Math.floor((t/1000) % 60),
    minutes = Math.floor((t/1000/60) % 60),
    hours = Math.floor((t/(1000*60*60)));

    timerH.textContent = hours;
    timerM.textContent = minutes;
    timerS.textContent = seconds;
}

setInterval(updateClock, 1000);

Answer 2

"Не меняет дату" - потому что дата у тебя всегда одна и та же, ибо вынесена вне цикла

Вот немного покрасивще исполнение твоего тз

let deadline = '2020-04-12';

const timerH = document.querySelector('.hours');
const timerM = document.querySelector('.minutes');
const timerS = document.querySelector('.seconds');

const updateClock=()=>{
    const t = Date.parse(deadline) - Date.parse(new Date());
    const seconds = ((t/1000) % 60) | 0;
    const minutes = ((t/1000/60) % 60) | 0;
    const hours = ((t/(1000*60*60))) | 0;
    
    timerH.textContent = hours < 10 ? '0' + hours : hours;
    timerM.textContent = minutes < 10 ? '0' + minutes : minutes;
    timerS.textContent = seconds < 10 ? '0' + seconds : seconds;
    // console.log(hours, minutes, seconds);
};

updateClock();
setInterval(updateClock, 1000);

<span class="hours"></span>
<span class="minutes"></span>
<span class="seconds"></span>

БЛОГ НА HUSL

Таймер js setInterval

Ответы (2 шт):