javascript - 无法设置 null 的属性 'innerHTML' - 似乎没有办法修复它

Question

我查看了其他 stackoverflow 问题和其他网站来寻找答案。他们提供了帮助，但仍然不起作用，我不知道为什么。请告诉我我做错了什么。谢谢!

我目前正在做的事情:

1. 在 window.onload 函数中定义全局变量并运行函数
2. 在主要 HTML 部分之后添加 Javascript
3. 对变量名称进行拼写检查

window.onload = function() {
  window.level = 0;
  window.xp = 0;
  window.totalMoney = 0;
  window.clicks = 0;
  window.money = 0;
  window.max = 0;
  Up();
}

function UpLevel() {
  xp = totalMoney + 5 * clicks;
  level = Math.floor(0.5 * Math.log2(xp / 10 + 2));
  max = Math.floor(Math.pow(1.5, level) * 100) - 100;
}

function Up() {
  UpLevel();
  document.getElementById("level").innerHTML = level;
  document.getElementById("xp").innerHTML = xp;
  document.getElementById("levelUp").innerHTML = Math.ceil(Math.pow(2, 2 * level + 2) * 10 - 20);
  document.getElementById("clicks").innerHTML = clicks;
  document.getElementById("money").innerHTML = money;
  document.getElementById("max").innerHTML = max;
}

#fontA {
  font-family: "Courier New";
  font-variant: small-caps;
  font-size: 50px;
}

#PosA {
  position: absolute;
  top: 20px;
  left: 20px;
}

#PosB {
  position: absolute;
  top: 20px;
  left: 400px;
}

 <div id="fontA">
    <div id="PosA">
      Level: <label id="level" />
      <br/> XP: <label id="xp" /> / <label id="levelUp" />
      <br/>
      <br/> Clicks: <label id="clicks" />
    </div>
    <div id="PosB">
      $ <label id="money" />
      <br/> / <label id="max" />
    </div>
  </div>

Answer 1

<label>是一个对标签。您必须编写开始和结束标记( <label id="something"></label> ):

<div id="PosA">
  Level: <label id="level"></label>
  <br> XP: <label id="xp"></label> / <label id="levelUp"></label>
  <br>
  <br> Clicks: <label id="clicks"></label>
</div>
<div id="PosB">
  $ <label id="money"></label>
  <br> / <label id="max"></label>
</div>

你现在编写的方式在 HTML 中是无效的(好吧，并不是真的无效，但是奇怪的事情发生了)。它在 XHTML 中是有效的，但它是一种死技术，我建议您不要使用它。