javascript - JS循环遍历数组来改变段落的innerHTML

Question

我仍在学习 js 基础知识。在这个问题中，我的预期结果是得到 a,b,c,d，但它给出了 a,b,c,c。谁能解释一下吗？当我输入 x[3] 时，它会打印 a,b,c,d。

<p>a</p>
<p>b</p>
<p>c</p>
<p id="demo">d</p>

<script>
    var x = document.getElementsByTagName("p");
    var i;
    for (i = 0; i < x.length; i++) {
        document.getElementById("demo").innerHTML = x[i].innerHTML;
    }
</script>

Answer 1

这里的问题是，当您的代码循环到具有“demo”ID 的 p 标记时，它会将自己的值读取为“c”，因为这是您在上一次迭代中分配给它的值。

这样<p id="demo">d</p>变成

a 代表 i=0

b 代表 i=1

c 代表 i=2

当它到达i=3时，它读取自身的值“c”，因此它重新分配自己为“c”。