Question

以下是代码和代码段：

var amount = prompt("How many list items would you like?");

if(isNaN(amount) || amount < 1) {
    alert("Please enter a positive whole number");
} else {
    for(i = 0; i <= amount; i++) {
        document.getElementById("content").innerHTML = "Loop: " + i + "<br>"; 
    }
}

<div id="content"></div>

嗨，我是Javascript的新手，我无法弄清楚这一点。如何使用循环在div标签“content”中写入每个循环显示div标签内的值？

Answer 1

更改为+=而不是=并以1开始for循环，除非您要打印为循环0，循环1等等...

document.getElementById("content").innerHTML += "Loop: " + i + "<br>";

var amount = prompt("How many list items would you like?");

if(isNaN(amount) || amount < 1) {
    alert("Please enter a positive whole number");
} else {
    for(i = 1; i <= amount; i++) {
        document.getElementById("content").innerHTML += "Loop: " + i + "<br>"; 
    }
}

<div id="content"></div>

Answer 2

您的代码看起来基本正确，但您需要了解浏览器执行javascript的上下文。对于给定的计算（事件），浏览器通常在对实际页面进行任何重绘之前执行所有计算。在您的情况下，这意味着只使用innerHTML的最后一个值。一种方法是在返回之前累积整个innerHTML值（我看IsabelHM刚刚发布了）。第二种方法是使用类似setTimeout的方法将计算扩展到多个＆＃34;会话＆＃34; - 像

var i = 0;
count = function() {
     document.getElementById("content").innerHTML = "Loop: " + i + "<br>";
     i++;
     if (i < amount) {
        window.setTimeout(count, 100);
     }
};
count();

注意 - 我没有运行，但想法就在那里。我基本上每隔100毫秒算一次。

如何使用JavaScript在循环中使用innerHTML？

2 个答案: