Question

当我使用document.write它可以工作，但它不适用于getElementById。同样的。 `

<div id="mydiv"></div>
    <script>
        var i = 0;
        for (i=0; i<=10; i++){
        //while (i<=10){
            document.getElementById("mydiv").innerHTML = i + "<br>";
            //i++;
        }
    </script>

输出只有10，但我想逐行列出0-10。怎么解决？

Answer 1

每次循环运行时，它都会覆盖div的innerHTML。

此实现以 html 的空字符串开头，然后使用 + = 连接计数器，并在每次迭代时连接＆lt; br＆gt;

    var i = 0;
    var html = '';
    for (i=0; i<=10; i++){
        html += i + '<br>';
    }
    document.getElementById("mydiv").innerHTML = html;

Answer 2

您正在覆盖或替换内容。您需要附加，因此您可以使用+=运算符代替=。

<div id="mydiv"></div>
<script>
  var i = 0;
  for (i=0; i<=10; i++){
    document.getElementById("mydiv").innerHTML += i + "<br>";
  }
</script>

Answer 3

你被覆盖了。改为追加。

for (var i = 0; i <= 10; i++) {
  var div = document.getElementById("mydiv");
  div.innerHTML = div.innerHTML + "<br/>" + i;
}

<div id="mydiv"></div>

Answer 4

虽然其他答案都是正确的，但我认为这是一种冒险行为，因为您的浏览器可能会在加载所有html元素之前尝试执行代码。（例如，如果你的div在代码之后是）。

所以我建议这个：

<div id="mydiv"> <script> for (var i=0; i<=10; i++){ document.write ( i + "<br />"); } </script> </div>

N.B：但是，请记住，你不能使用＆＃34; document.write＆＃34; 在页面完成加载后。

你也可以这样做是安全的：

<div id="mydiv"></div> <script> document.onload = function(){ temp="" for (var i=0; i<=10; i++){ temp += i + "<br />"; } document.getElementById("mydiv").innerHTML = temp; } </script>

为什么我的for循环没有执行？

4 个答案: