javascript - 为 json 数组中的每个对象创建一个列表

Question

我有一个 json 数组:

[
  {
    "id":"1",
    "0":"1",
    "name":"Quique",
    "1":"Quique"
  },
  {
    "id":"2",
    "0":"2",
    "name":"Kety",
    "1":"Kety"
  }
]

所以，我想从 json 中获取值 id 和 name 并用它们来表示 HTML 中的 json 文件。对我来说完美的结果是这样的:

<div id="container">
  <div>Quique, id 1</div>
  <div>Kety, id 2</div>
</div>

Answer 1

纯使用Array.prototype.forEach()函数的Javascript解决方案:

var data = [
  {
    "id":"1",
    "0":"1",
    "name":"Quique",
    "1":"Quique"
  },
  {
    "id":"2",
    "0":"2",
    "name":"Kety",
    "1":"Kety"
  }
],
contentStr = "";

data.forEach(function(o){
    contentStr += "<div>"+ o.name +", id "+ o.id +"</div>";
});
document.getElementById('container').innerHTML = contentStr;

<div id="container"> 
</div>

<小时/>

另一种选择是使用 Array.prototype.reduce() 函数:

document.getElementById('container').innerHTML = data.reduce(function(h, o){
  return h + "<div>"+ o.name +", id "+ o.id +"</div>";
}, '');