【问题标题】:Problem to execute DOM from if statement in Javascript从 Javascript 中的 if 语句执行 DOM 的问题
【发布时间】:2020-09-07 05:21:42
【问题描述】:

所以我尝试运行一个简单的函数,根据随机生成的数字生成获胜者。 到目前为止一切顺利,但是当我不仅要返回“获胜者”而且要返回更改 innerHTML 时,它不会说“.innerHTML 不是函数”。

**我尝试将 return 也作为比 document.innerHTML 的回报... 另外,我尝试在 var 中创建它并返回 var 但总是出现同样的问题。

function runNum() {
  // randomize of number between 1-6
  var a = Math.floor(Math.random() * 6 + 1);
  var b = Math.floor(Math.random() * 6 + 1);
  console.log(a, b);
  if (a > b) {
    document.querySelector(".winnerclick").innerHTML("winner1");
    console.log("a");
  }
  if (b > a) {
    return document.querySelector(".winnerclick").innerHTML("winner2");
    console.log("b");
  }
  if (a === b) {
    document.querySelector(".winnerclick").innerTEXT("Draw - no winner");
  }
}
<h1 class="winnerclick">
  Click on the button to play!
</h1>
<button onclick="runNum()">
Click to start
</button>

我尝试找到答案,但没有解决这个问题。为什么没有退回?

【问题讨论】:

  • .innerHTML 不是函数。你给它赋值。
  • 你看过innerHTML documentation吗?它被定义为属性,而不是函数。

标签: javascript if-statement innerhtml


【解决方案1】:

实际上,您面临的错误是正确的,因为innerHTML 不是函数,因此您也不能用括号调用它。你可以通过给它赋值来设置它的值。

所以你的最终代码应该是这样的:

function runNum() {
  // randomize of number between 1-6
  var a = Math.floor(Math.random() * 6 + 1);
  var b = Math.floor(Math.random() * 6 + 1);
  console.log(a, b);
  if (a > b) {
    document.querySelector(".winnerclick").innerHTML = "winner1";
    console.log("a");
  }
  if (b > a) {
    return document.querySelector(".winnerclick").innerHTML = "winner2";
    console.log("b");
  }
  if (a === b) {
    document.querySelector(".winnerclick").innerTEXT = "Draw - no winner";
  }
}
<h1 class="winnerclick">
  Click on the button to play!
</h1>
<button onclick="runNum()">
Click to start
</button>

【讨论】:

  • 天哪,我怎么会错过它?我花了至少 2 个小时来弄清楚发生了什么,这一切看起来都很棒,但是 = 而不是 ()。非常感谢你们!
【解决方案2】:

Pointy 是正确的,但我觉得他们的答案可能需要稍微澄清一下。当你想改变 .innerHTML 的值时,不要使用 .innerHTML("new value");你使用 .innerHTML = "new value";

【讨论】:

  • 非常感谢,两小时后我不明白我是怎么错过的。只是语法,它是在我看到文档和其他问题之后。谢谢!
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-06-17
  • 2019-09-20
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多