首先是的，我确实查看了有关此主题的许多其他代码，但没有一个像我的代码。我有一个非常基本的代码，所以如果我错过了一些明显的东西，我深表歉意，但我不明白为什么我的代码只显示一个数字。
这是代码。
<!DOCTYPE html>
<head>
</head>
<body>
<div id="test"></div>
<script>
var wildCard = (Math.floor(Math.random() * 5) + 1);
var temp = 1;
for (var i=0; i < 5; i++){
document.getElementById("test").innerHTML = wildCard + "<br />";
temp++;
}
</script>
</body>
</html>
非常基本的代码，但是唯一的问题是我只打印了一个随机数，而不是垂直线向下打印 5。我想知道我错过了什么，为什么它不会循环。
之所以只打印一个数字而不是五个，是因为每次迭代中都会替换 ID 为test的内部 html 的 DOM 节点。当 for 循环结束时，您只能看到上次迭代的值。
您可以使用createTextNode和appendChild来完成此任务，如下所示：
var temp = 1;
for (var i=0; i < 5; i++){
const wildCard = (Math.floor(Math.random() * 5) + 1);
const textNode = document.createTextNode(wildCard);
const testDiv = document.getElementById("test");
testDiv.appendChild(textNode)
testDiv.appendChild(document.createElement("br"));
temp++;
}
在循环的每次迭代中生成一个新的随机数，然后在循环完成后分配一次完整的 HTML。
<script>
var temp = 1;
var html = "";
for (var i=0; i < 5; i++) {
var wildCard = (Math.floor(Math.random() * 5) + 1);
html += wildCard + "<br/>";
temp++;
}
document.getElementById("test").innerHTML = html;
</script>