html页面中数组的输出答案

【问题标题】：Output from an array in html pagehtml页面中数组的输出
【发布时间】：2017-02-25 14:20:34
【问题描述】：

我正在尝试将数组中的数组内容输出到 HTML 页面上的一个小区域。我只能输出一维数组。

简单地说，预期的数组有许多属性，但我很难找到正确的代码来输出嵌套在数组中的数组。

属性是； ID（整数）位置（字符串）邮政编码（字符串）可能会添加其他属性。

为了输出我使用以下代码的信息（我只能在单个数组上工作 - 即使我改为使用 [i][x] ）

document.write("<tr><td>ID " + i + " is:</td>");

document.write("<td>" + LocationArray[i] + "</td></tr>");

如何正确创建一个能够存储信息的数组，然后输出其中的特定部分？例如显示LocationArray[2][3]的内容

document.write 是一种高效的方法，还是有更好的方法？

【问题讨论】：

标签： html arrays multidimensional-array

【解决方案1】：

我整理了一些东西，可以帮助你。最后回答您关于“正确方式”创建数组的问题；有两种可能：

使用基于“属性”的属性创建一个数组：
var locationsArray = [{ID:123,Location:'blabla',Postalcode:'1234'}];
使用字符串键创建一个数组：
var locationsArray = [{'ID':123,'Location':'blabla','Postalcode':'1234'}];

在我的示例中，我使用了第一次尝试。

关于你的第二个问题：document.write 只是写在文档的末尾。如果您想写入网站的特定区域，请创建一个容器（例如）并为其指定一个 id。然后更改创建容器的属性 innerHTML，就像我在示例中所做的那样。

HTML：

<div id="locations"></div>
<button onclick="printLocations()">Print Locations</button>

Javascript：

function printLocations() {
  var locationsArray = [{
    ID : 123,
    Location : 'Candyland',
    Postalcode : '1234'
  }, {
    ID : 456,
    Location : 'Middle-Earth',
    Postalcode : '4567'
  } 
  ];

  var locationsHtml = '';
  for (var index in locationsArray) {
        locationsHtml += 'ID: ' + locationsArray[index].ID + ', ' +
                         'Location: ' + locationsArray[index].Location + ', ' +
                         'Postalcode: ' + locationsArray[index].Postalcode + '<br />';
  }
  console.log(locationsHtml);
  document.getElementById('locations').innerHTML = locationsHtml;
}

如果您只想编写数组的特定部分（在您的示例中只是一个特定位置），只需使用您想要的索引并以与我示例中的 for 循环相同的方式访问它：

  var locationsHtml = locationsArray[1].ID + locationsArray[1].Location + etc...; 
  /*with string-keys: var locationsHtml = locationsArray[1]['ID'] + etc...;*/
  document.getElementById('locations').innerHTML = locationsHtml;

【讨论】：