为什么函数在柱值为零时不起作用

Question

function function1() {
document.getElementById("progress1");
progress1.value -= 25
}

function gameOver() {
if (document.getElementById("progress1").getAttribute("value") === 0) {
alert("GameOver")
}else {
}
}

gameOver();

<button onclick="function1()" id="button1">Click Me !</button>
<progress id="progress1" value="50" max="100"></progress>

我想运行 gameOver 函数，当条值为 0 但它没有响应时

Answer 1

function function1() {
  document.getElementById("progress1");
  progress1.value -= 25

  if (progress1.value === 0) {
    alert("GameOver")
  } else {}
}

<button onclick="function1()" id="button1">Click Me !</button>
<progress id="progress1" value="50" max="100"></progress>

Answer 2

首先，如果你能给你的函数起一个有意义的名字会更好，这样当你的代码变大时你可以理解它做了什么。

您正在调用该函数以减少进度的点击事件，因此点击是一个事件，您应该将该事件发生后接下来发生的事情放在事件函数中。

下面的代码块正在检查进度是否在事件发生后减少到 0，因此我们可以在此处进行一些处理以达到零。

function decreaseProgress() {
  const progress = document.getElementById("progress1");
  progress.value -= 25;
  if(progress.value <= 0){
     alert("Game Over");
  }
}

为什么函数在柱值为零时不起作用

Why does the function not work when the bar value is zero

javascript

if-statement

getattribute