Как мне постоянно обновлять sh вывод getTime?

Question

Я делаю маленькие часы с помощью getTime (), но результат не обновляется sh. Я пробовал это:

<p id="clock"></p>

var i;
for (i=0; i < 5; i++){
    var date = getTime;
    var time = time.getHour() + ":" + time.getMinute() + ":" + time.getSecond()
    getElementById('clock').innerHTML = time;
}

Хотя он просто держит мою вкладку в постоянном состоянии загрузки. Как это исправить? Спасибо!

Answer 1

Просто переместите свой код внутрь setInterval ()

let i = 5;
const timer = setInterval(() => {
    var date = getTime;
    var time = time.getHour() + ":" + time.getMinute() + ":" + time.getSecond()
    getElementById('clock').innerHTML = time;

    i--;
    if (i < 0) {
       clearInterval(timer)
   }
}, 1000);

Итак, setInterval () позволяет вашему коду выполняться асинхронно, это означает, что он не блокирует остальную часть выполнения, потому что он выполняется «отдельно» (я бы хотел бы описать это лучше, но мне не хватает навыков английского sh).

setInterval запускает ваш код каждые 1000 мс (как указано) навсегда, если вы не очистите его с помощью clearInterval (). Если вы хотите сделать таймер, это очень полезно.

this () => {} - стрелочная функция. Вы также можете использовать function () {}, если хотите, в этом случае это не имеет значения.

Вот ссылка w3schools для setInterval (): https://www.w3schools.com/jsref/met_win_setinterval.asp

а вот ссылка MDN на асинхронный javascript: https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Asynchronous

Удачи в вашем проекте;)

Answer 2

Надеюсь, это поможет

setInterval (function refresh(){
  var fecha = new Date();
  var hora = fecha.getHours();
  var minutos = fecha.getMinutes();
  var segundos = fecha.getSeconds();

  var textoHora = `
    ${hora}:${minutos}:${segundos}
  `;
  document.getElementById('clock').innerHTML = textoHora;
}, 1000);