Таймер в 2 знака

Question

Есть таймер на JS. Отсчитывает время, всё хорошо. Но тогда, когда часы, минуты и секунды достигают момента, когда число меньше 10, то время отображается по одной цифре ( Пример: 4 минуты ). Выглядит не очень. Хотел сделать, чтобы при числе меньше 10 прибавлялся 0 перед символом ( Чтобы было: 04 минуты. ). Требуется помощь. Вот, пытался сделать сам

let timer_show = document.getElementById("timer");

function diffSubtract(date1, date2) {
  return date2 - date1;
}

let end_date = {
  "full_year": "2021",
  "month": "09",
  "day": "29",
  "hours": "00",
  "minutes": "00",
  "seconds": "00"
}

let end_date_str = `${end_date.full_year}-${end_date.month}-${end_date.day}T${end_date.hours}:${end_date.minutes}:${end_date.seconds}`;

timer = setInterval(function () {
  let now = new Date();
  let date = new Date(end_date_str);
  let ms_left = diffSubtract(now, date);
  if (ms_left <= 0) {
    clearInterval(timer);
    timer_show.innerHTML = `0  :  0  :  0  :  0`;
  } else {
    let res = new Date(ms_left);
    // далее мои попытки реализовать добавление ноля
    if (res.getUTCSeconds < '10') res.getUTCSeconds = '0' + res.getUTCSeconds;
    if (res.getUTCMinutes < '10') res.getUTCMinutes = '0' + res.getUTCMinutes;
    // конец попыткам
    let str_timer = `<span class="t_date">${res.getUTCDate() - 1}</span> :  <span class="t_hour">${res.getUTCHours()}</span>  :  <span class="t_min">${res.getUTCMinutes()}</span>  :  <span class="t_sec">${res.getUTCSeconds()}</span>`;
    timer_show.innerHTML = str_timer;
  }
}, 1000)

    <div class="timer">
      <div id="timer"></div>
    </div>

Answer 1

Дело в том res.getUTCSeconds это функция и вы пытаетесь к этой функции присвоить строку. Не надо так делать)

Вот исправил ваш код надеюсь вы дружите с тернарным оператором(можно и без него обойтись если знаете как).

В начале кода моя функция timeNormalize

let timer_show = document.getElementById("timer");

function diffSubtract(date1, date2) {
  return date2 - date1;
}

////моя функция
function timeNormalize(time){
    return (time<10)?'0'+time:`${time}`
}

let end_date = {
  "full_year": "2021",
  "month": "10",
  "day": "01",
  "hours": "00",
  "minutes": "00",
  "seconds": "00"
}

let end_date_str = `${end_date.full_year}-${end_date.month}-${end_date.day}T${end_date.hours}:${end_date.minutes}:${end_date.seconds}`;

timer = setInterval(function () {
  let now = new Date();
  let date = new Date(end_date_str);
  let ms_left = diffSubtract(now, date);
  if (ms_left <= 0) {
    clearInterval(timer);
    timer_show.innerHTML = `0  :  0  :  0  :  0`;
  } else {
    let res = new Date(ms_left);
    /////мой код
    const strDate       = timeNormalize(res.getUTCDate()-1)////ваш минус снизу претащил сюда
    const strHours      = timeNormalize(res.getUTCHours())
    const strMinutes    = timeNormalize(res.getUTCMinutes())
    const strSeconds    = timeNormalize(res.getUTCSeconds())
    // конец моего кода
    let str_timer = `<span class="t_date">${strDate}</span> :  <span class="t_hour">${strHours}</span>  :  <span class="t_min">${strMinutes}</span>  :  <span class="t_sec">${strSeconds}</span>`;
    timer_show.innerHTML = str_timer;
  }
}, 1000)

<div class="timer">
        <div id="timer"></div>
    </div>

БЛОГ НА HUSL

Таймер в 2 знака

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