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

时间:2016-04-03 22:39:41

标签: javascript arrays

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

我这样做的方法是创建一个数组并将其与游戏信息一起存储。所以七月份会是这样的:

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

在我的main函数(按下Submit按钮时执行的函数)中,我想打印数组。

var schedule = getSchedule(July);

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

出于某种原因,这不起作用。所有这一切都打印出数组中的最后一个值而不是整个数据。怎么不打印整个阵列?我试图做document.write(schedule[i] + "<br />");而那并没有做我想要的。它打印出来,但是它将它自己打印在一个页面上我无法在新的一个月里或者回到主页等等。有没有办法让它打印所有元素而不仅仅是最后一个一个?

2 个答案:

答案 0 :(得分:4)

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

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

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

如果您想在最后一个条目之后使用<br>,只需添加它:

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

答案 1 :(得分:4)

虽然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的回答肯定更有效率。