如何使用 `document.getElementByID("results").innerHTML = results 打印？ [关闭]答案

【问题标题】：How can I print using `document.getElementByID("results").innerHTML = results? [closed]如何使用 `document.getElementByID("results").innerHTML = results 打印？ [关闭]
【发布时间】：2014-04-15 19:54:57
【问题描述】：

当我单击滚动按钮时，没有任何反应。有没有办法使用document.getElementByID("results").innerHTML 显示结果，还是不推荐这样做？

HTML

<p>How many dice?
    <br/>
    <input type="text" id="numDice" />
</p>
<p>How many sides per die?
    <br/>
    <input type="text" id="numSides" />
</p>
<button onclick="diceRoll()" id="roll"/>Roll!</button>
<p id="results"></p>

JavaScript

var numDice = document.getElementByID(numDice).innerHTML;
var numSides = document.getElementByID(numSides).innerHTML;

function diceRoll() {
  var results = "";

  for (var i = 0; i < numDice; i++) {
    results += (Math.random() * numSides) + 1;
  }

  document.getElementByID("results").innerHTML = results;
}

CodePen

【问题讨论】：

这个问题似乎是题外话，因为它是关于一个错字
不应该var numDice = document.getElementByID(numDice).innerHTML; 是var numDice = document.getElementByID(numDice).value;？

标签： javascript onclick innerhtml dice

【解决方案1】：

错别字，不是

getElementByID

但是

getElementById

大小写很重要，传递的参数是字符串，所以要加引号

function diceRoll() {
    var numDice = document.getElementById('numDice').value;
    var numSides = document.getElementById('numSides').value;
    var results = "";

    for (var i = 0; i < numDice; i++) {
        results += (Math.round(results + (Math.random() * numSides) + 1)).toString();
    }

    document.getElementById('results').innerHTML = results;
}

FIDDLE

【讨论】：

我们不想要值而不是 innerHTML 吗？
@j08691 - 是的，我们会 -> jsfiddle.net/JZV9V
我的意思是打印成一串数字。我该怎么办？我在这里做错了什么：results += toString(Math.floor(Math.random() * numSides + 1)) + " ";
@JohnD。 - 哦，toString 紧随其后，请参阅更新后的答案。

【解决方案2】：

您正在调用document.getElementByID(numDice).innerHTML在DOM 准备好之前。元素不存在，所以会报错。

您希望在调用diceRoll() 时每次获取值，以便获取用户输入的值。 numDice 将不会在值更改时自动更新。

附：它是getElementById，你想用.value() 代替<input>s。

function diceRoll() {
  var results = "";
  var numDice = parseInt(document.getElementById('numDice').value, 10);
  var numSides = parseInt(document.getElementById('numSides').value, 10);

  for (var i = 0; i < numDice; i++) {
    results += (Math.random() * numSides) + 1;
  }

  document.getElementById("results").innerHTML = results;
}

【讨论】：