Question

我有这种结构的JSON文件：

＆＃13;

{
  "launches": [{
    "name": "First Name"
  }],
  "launches": [{
    "name": "Second Name"
  }],
  "launches": [{
    "name": "Third Name"
  }],
  "launches": [{
    "name": "Fourth Name"
  }]
}

＆＃13;

我添加如下数据：

$('#div-name').append(d.name);

当它显示在网页上时，它被放置在一个没有空格的div中。我可以向追加添加<p>标记，但仍会显示所有数据并创建新的div以显示它。

基本上，我要做的是为每个单独的＆＃34;名称＆＃34;创建一个div。 value和每个div只显示一个值。

Answer 1

首先，您的“json”不是有效的json ，请记住，在json对象中，您不能拥有重复的密钥。您可以轻松地使用an online validator来帮助您...在修复之后，让我们假设您实际拥有的是一组对象，如：

[
    {"name": "Falcon 9"},
    {"name": "Orion"},
    {"name": "PSLV"},
    {"name": "Soyuz"}
]

使用这个有效的json，你可以很容易地循环遍历所有的元素（并使用你使用的jQuery）：

var json = [ ... ];

$(function() {
    $.each(json, function(i, item){
        $("p").append("<div>" + item.name + "</div>");
    });
});

这是一个实时测试：https://jsbin.com/bixadegeye/1/edit?html,css,js,output

Answer 2

一种稍微不同的方式：

var data = {
  "names": [
    "Falcon 9",
    "Orion",
    "PSLV",
    "Soyuz"
  ]
};

$.each( data["names"], function( key, value ) {
    $('#div-name').append(value+"<br />");
});

将具有相同名称的JSON数据放入不同的div

2 个答案: