Javascript 在 for 循环之前附加 html 标签

Question

我在下面有以下代码，我试图在其中创建一个 ul标签，并在其中使用 for 循环动态创建 li元素。单独收盘ul标签在循环完成后创建。

代码有效。除了代码没有像我想要的那样按顺序运行的问题。 ul在 for 循环可以处理到页面之前标记被关闭，导致 html 看起来更像:

<ul></ul><li>0</li><li>1</li>...

var insidethediv = document.getElementById("insidethediv");
var numero = 5;

insidethediv.innerHTML = "<ul>";
for (i = 0; i < 5; i++){
insidethediv.innerHTML += "<li>"+i+"</li>";
}
insidethediv.innerHTML += "</ul>";

<div id="insidethediv"></div>

Answer 1

直接分配给 innerHTML 在这里不是一个好主意。 innerHTML 需要一个完整的 html 片段，即所有打开的标签都应该关闭。但是在这里，您在构建时分配给了部分 html 片段。尝试先创建完整的 html，然后将其分配给 innerHTML，例如像这样:

var insidethediv = document.getElementById("insidethediv");
var numero = 5;

var s = "<ul>";
for (i = 0; i < 5; i++){
    s += "<li>"+i+"</li>";
}
s += "</ul>";
insidethediv.innerHTML = s;