为什么我不能用新价值代替旧价值

Question

我正在开发一个非常简单的浏览器游戏，其中包含一个人和一个硬币，并且该游戏的目的是简单地使用键盘上的箭头键来获得任意数量的随机放置的硬币。在顶部，我有一个计分计数器，而不是将新分数替换为旧分数，而只是将新分数添加到旧分数上（例如：1、12、123、1234、12345，实际上分数应该是5）。

这是我的职能：

const score = document.querySelector("#score");

let total = 0;

const moveCoin = () => {
  const width = Math.floor(Math.random() * window.innerWidth);
  const height = Math.floor(Math.random() * window.innerHeight);
  coin.style.top = `${height}px`;
  coin.style.left = `${width}px`;
  total += 1;
  console.log(total);
  score.append(total);
};

moveCoin();

和我所看到的照片：

Answer 1

您可以使用

score.innerText = total;

因为append函数被添加到乐谱的末尾。

Answer 2

使用append或innerText属性代替使用innerHTML。您可以在w3Schools和Mozilla MDN中看到更多详细的示例。希望这会有所帮助。