如何在计分板上添加分数?

时间:2019-01-15 11:04:56

标签: javascript html css if-statement

我正在做一个简单的游戏,这是我第一个使用JavaScript的项目。因此,您单击该按钮,它将为您和计算机提供数学随机数,获胜者是数字较大的人。我创建了一个计分板,并希望在有人获胜时添加分数。问题是它不起作用,能否请您给我一些解决方案?

我的HTML代码:

message

我的用于添加得分的JS函数:

   <html>
<head>
  <meta charset="UTF-8">
  <link rel="stylesheet" type="text/css" href="style.css">
  <title>Random - the game</title>
</head>
<body>
  <header>
    <center><h1>Random</h1>
    <h2>The Game</h2></center></center>
  </header>
  <div class = "scoreTable">
    <span id="userScore">0</span>
    <span>:</span>
    <span id="compScore">0</span>
  </div>
  <div id="button">
    <center><img id="buttonOff" src="images/buttonOff.png" alt="przycisk" height="150px" width="150px" onmousedown="mouseDown()" onmouseup="mouseUp()" onclick="randomNumUser(); randomNumComp(); addScore()" /><center>
  </div>
  <center><div id="message1">
    <p>Your number</p>
    <p class="number" id="userNumber"></p>
  </div></center>
  <center><div id="message2">
    <p>Computer number</p>
    <p class="number" id="computerNumber"></p>
  </div></center>
<script src="main.js"></script>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

您需要使用此DOM元素的“值”。更新的代码在这里

 function addScore() {
   let userResult = document.getElementById("userNumber");
   let compResult = document.getElementById("computerNumber");
   let userScore = document.getElementById("userScore");
   let computerScore = document.getElementById("compScore");
   if (Number(userResult.innerText) > Number(compResult.innerText)) {
     userScore.innerText = Number(userScore.innerText) + 1;
   } else if (Number(userResult.innerText) < Number(compResult.innerText)) {
   computerScore.innerText = Number(computerScore.innerText) + 1;
 }
}