document.getElementById（“ demo”）。innerHTML = Math.ceil（（Math.random（）* 10）-1）;只打印一个数字？

Question

为什么function myFunction() { var bbb = document.getElementById("ilgis").value; for (i = 0; i <= bbb; i++) { //document.writeln(aaa); document.getElementById("demo").innerHTML = Math.ceil((Math.random() * 10) - 1); } }只打印1个数字？

<input type="number" id="ilgis" value="123">

<button onclick="myFunction()">Click me</button>

<p id="demo"></p>

navbar-collapse

Answer 1

因为您一直都在替换innerHTML，而不是添加任何东西。

要添加内容，请使用+=而不是=：

function myFunction() {
  var bbb = document.getElementById("ilgis").value;

  for (i = 0; i <= bbb; i++) {

    //document.writeln(aaa);
    document.getElementById("demo").innerHTML += Math.ceil((Math.random() * 10) - 1);

  }
}

<input type="number" id="ilgis" value="123">

<button onclick="myFunction()">Click me</button>

<p id="demo"></p>

---

编辑：

正如@Robin Zigmond所述，实际上最好构造一个字符串并将该字符串附加到innerHTML一次，直到循环完成以节省性能：

function myFunction() {
  var bbb = document.getElementById("ilgis").value;

  var numbers = "";
  for (i = 0; i <= bbb; i++) {

    //document.writeln(aaa);
    numbers += Math.ceil((Math.random() * 10) - 1);

  }
  document.getElementById("demo").innerHTML = numbers;
}

<input type="number" id="ilgis" value="123">

<button onclick="myFunction()">Click me</button>

<p id="demo"></p>