在单独的行上打印数组的每个值 Javascript答案

【问题标题】：Printing each value of an array on a separate line Javascript在单独的行上打印数组的每个值 Javascript
【发布时间】：2016-04-03 22:39:41
【问题描述】：

我有一个涉及 Javascript 以允许与网页交互的程序。这是一个棒球网站，所以我正在做的是提示用户输入一个月。用户可以输入一个数字，例如 6 代表六月，或月份本身的名称，程序将显示他们在该月玩的所有游戏。

我这样做的方法是创建一个数组并将其与游戏信息一起存储。所以 7 月份看起来像这样：

if(month == 7)    // July
{
    var gamesPlayed = ["7/1/16: Team1 @ Team2", "7/3/16: Team2 @ Team 4",
                       "7/4/16: Team3 @ Team2" , ... ,etc, ...];
}

在我的主函数（按下提交按钮时执行的那个）中，我想打印数组。

var schedule = getSchedule(July);

for(var i = 0; i < schedule.length; i++)
{
    document.getElementById("result").innerHTML = schedule[i] + "<br />";
}

由于某种原因，这不起作用。它所做的只是打印数组中的最后一个值，而不是全部。为什么不打印整个阵列？我试图做document.write(schedule[i] + "<br />");，但这并没有达到我想要的效果。它打印了它，但它自己打印在一个页面上，我无法在新的一个月中计时或返回主页等。有没有办法让它打印所有元素，而不仅仅是最后一个一个？

【问题讨论】：

每次循环，您将 .innerHTML 设置为数组的单个元素。

标签： javascript arrays

【解决方案1】：

您可以使用.join()将数组组合成一个字符串，并用<br>分隔每个条目：

document.getElementById("result").innerHTML =
  schedule.join("<br>");

<br> 中不需要自动关闭/。更重要的是，不需要for 循环。上面的代码将完成整个事情。

如果您想在最后一个条目后添加<br>，只需添加它：

document.getElementById("result").innerHTML =
  schedule.join("<br>") + "<br>";

【讨论】：

【解决方案2】：

虽然 Pointy 的回答是正确的，但它并没有解释为什么您的代码不起作用。我会试着解释一下：

错误在于此for 循环以及您如何使用innerHTML。

for(var i = 0; i < schedule.length; i++)
{
    document.getElementById("result").innerHTML = schedule[i] + "<br />";
}

基本上，在循环的每次迭代中，您都会重置 result 元素的 HTML，而不是附加到它。只需进行以下小改动。

for(var i = 0; i < schedule.length; i++)
{
    document.getElementById("result").innerHTML += schedule[i] + "<br />";
}

不过，Pointy 的回答肯定更有效。

【讨论】：