javascript - 无法让定时器的内容每秒更新一次

Question

在此代码中，我创建了一个 div 元素并将其附加到“timer”div。我想主要清除 div 元素以显示每秒的秒值。然而，我只得到一次秒。我不明白如何解决它。我添加了一个检查来删除计时器的子元素(如果它们存在，这当然会在创建许多元素时发生)。如何让定时器div的内容每秒更新一次？

let timer = document.getElementById('timer');
let time = setInterval(() => {
  while (timer.firstChild) {
    timer.removeChild(timer.firstChild);
  }
  timer.append(document.createElement('div').textContent = `${new Date().getSeconds()}`)
}, 1000);   

Answer 1

您的代码似乎可以正常工作，请尝试此代码段。

let timer = document.getElementById('timer');

let time = setInterval(() => {
  while (timer.firstChild) {
    timer.removeChild(timer.firstChild);
  }

  timer.append(
    document.createElement('div').textContent = `
        ${new Date().getSeconds()}                
  `)
}, 1000);

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