使用 GetJSON Jquery 解析复杂数组

Question

TLDR：

1. 从这个问题开始，在得到一些信息后简化了它它的工作并在这里继续。
2. 我需要“获取”JSON 数组并
3. 正确格式化它，并将数组中的每个数组放置在相应的 DIV 中。
4. ??
5. 有用。

---

这是此问题的后续内容，旨在简化并继续。

我需要从数组中获取一些复杂的 JSON 数据。有了它，我需要标题和它的价值。我这样做的原因是因为我知道数组的名称，但不知道数组内部生成的数据。

可以说这个新数组如下所示：

{
  "Days": [{
      "day": "Sunday",
      "time": "10.00"
    },
    {
      "day": "Monday",
      "time": "12.00"
    },
    {
      "day": "Tuesday",
      "time": "09.00"
    },
    {
      "day": "Wednesday",
      "time": "10.00"
    },
    {
      "day": "Thursday",
      "time": "02.00"
    },
    {
      "day": "Friday",
      "time": "05.00"
    },
    {
      "day": "Saturday",
      "time": "08.00"
    }
  ]
}

感谢（Matthew Flaschen）修复，

我需要它来获得周日和周日。 10:00 以及所有其他人都一样。

我目前解析此代码的代码如下：

$.getJSON(url,
  function(data) {
    $.each(data, function(i, item) {
      $('.testfield').append('<p>' + item + '</p>');
    });
  });

如果没有在每个日期添加时间，它将解析数据如下：

Sunday, Monday, Tuesday, Wednesday, Thursday, Friday, Saturday

将时间添加到数组中的日期后，Firebug 不再将其识别为 JSON 字符串。所以我猜我在这里格式化了一些错误的东西。另外，我每天都需要&是时候换一条新线路了，我以为

$('.testfield').append('<p>' + item + '</p>' + '<br />');

会把每一个都应用到新线路上，但这不起作用。

1. 如何让每一天或每一项目都在新的一行上？
2. 如何让 $getjson 正确解析日期及其值的数据到 div 中？

Answer 1

试试这个（重新格式化的 JSON - 下次使用 JSONLint 检查您的 JSON）：

{
    "Days": [
        {
            "Sunday": "10.00",
            "Monday": "12.00",
            "Tuesday": "09.00",
            "Wednesday": "10.00",
            "Thursday": "02.00",
            "Friday": "05.00",
            "Saturday": "08.00" 
        }
    ]
}

使用它的脚本：

 $.getJSON( url, function(data){
  $.each(data.Days[0], function(key,value){
   $('.testfield').append('<p>' + key + ' : ' + value + '</p>');
  });
 });

Answer 2

这不是有效的 JSON。执行以下操作：

{"Days":
[{"day": "Sunday", "time": "10.00"},
 {"day": "Monday", "time": "12.00"},
 {"day": "Tuesday", "time": "09.00"},
 {"day": "Wednesday", "time": "10.00"},
 {"day": "Thursday", "time": "02.00"},
 {"day": "Friday", "time": "05.00"},
 {"day": "Saturday", "time": "08.00"}
]}

始终使用 JSONLint 或其他验证器来检查语法。

Answer 3

有点题外话，但如果你不确定内容，你应该使用安全的方法将数据插入 DOM。否则你的代码存在 XSS 漏洞。

除了安全问题之外，诸如“Foo Bar <[电子邮件受保护]之类的任何数据>”不会按照您（可能）想要的方式呈现。

例如，您可以使用 jQuery text() 方法：

$('.testfield').append($('<p></p>').text(item));