无法打印数组全部元素：循环内打印数组代码失效求助

嘿，我一眼就看出问题所在啦！你的循环逻辑有个小bug——每次迭代都直接用document.getElementById("demo").innerHTML = fruits[i];，这会覆盖掉之前已经写入的内容，所以循环结束后，页面上只会显示数组的最后一个元素Mango，而不是所有水果。

两种修正方案： #

方案1：使用+=追加内容

把赋值操作改成追加，这样每次循环都会把当前水果添加到已有内容后面，还可以加<br>让每个水果单独一行，可读性更强：

var fruits, text, fLen, i;
fruits = ["Banana", "Orange", "Apple", "Mango"];
fLen = fruits.length;
for (i = 0; i < fLen; i++) {
  document.getElementById("demo").innerHTML += fruits[i] + "<br>";
}

方案2：先拼接字符串，最后一次性赋值

这种方式性能更优（减少DOM操作次数），先把所有水果内容拼到一个变量里，最后再一次性写入DOM：

var fruits, text, fLen, i;
fruits = ["Banana", "Orange", "Apple", "Mango"];
fLen = fruits.length;
text = ""; // 初始化空字符串用于拼接
for (i = 0; i < fLen; i++) {
  text += fruits[i] + "<br>";
}
document.getElementById("demo").innerHTML = text;

对应的HTML保持不变即可：

<h2>JavaScript Arrays</h2>
<p id="demo"></p>

简单总结下：innerHTML = ...是替换原有内容，而innerHTML += ...是追加内容。如果要展示数组所有元素，就得避免每次循环都替换掉之前的结果哦～

内容的提问来源于stack exchange，提问作者aditya pratap