将 XML 转换为 JSON 并使用 jQuery 输出为 HTML

Converting XML to JSON and output to HTML with jQuery

我正在尝试验证我的想法,但使用这个 XML 到 JSON 脚本: https://github.com/sergeyt/jQuery-xml2json

然后获取 JSON 数据,然后使用 jQuery 将其输出到 HTML。

到目前为止,我已经能够正确加载数据并且我可以 console.log 输出 JSON 数据,结果是这样的:

releases:
  $: {}
  matching_count: "698"
  returned_count: "50"
  latestModified: "1537876805"
  release: Array(50)
   0:
    $: {}
    id: "713"
    headline: "Eiger BioPharmaceuticals to Participate in Investor Conferences"
    released: "1537876800"
    releaseDate: "Tue, 25 Sep 2018 08:00:00 -0400"
    modified: "1537876805"
    modifiedDate: "Tue, 25 Sep 2018 08:00:05 -0400"
  1:
   $: {}
    id: "712"
    headline: "Communications industry innovator to speak at AMEC Global Summit"
    released: "1491400800"
    releaseDate: "Wed, 05 Apr 2017 10:00:00 -0400"
    modified: "1491400806"
    modifiedDate: "Wed, 05 Apr 2017 10:00:06 -0400"
...

我目前的 JS 代码是这样的:

var ul = $("<ul>").appendTo("body");
$.ajax({
  url: "https://s3-us-west-2.amazonaws.com/s.cdpn.io/8689/list.xml",
  dataType: "xml",
  success: function(response) {
    json = $.xml2json(response);
    console.log(json);
    $(json).each(function(index, headline) {
      ul.append($(document.createElement("li")).text(headline));
    });
  }
});

问题是,当它呈现出来时,所有返回的都是 [object Object] li

所以,我知道我做错了什么,但我不确定我需要在何处以及在什么时候进行更改以获取数据,以便我可以渲染出 headlinereleaseDate,依此类推。

我在这里创建了一个代码笔: https://codepen.io/ultraloveninja/pen/YzPRjRw

我读到我可能需要使用 jQuery.parseJSON,但在稍微测试之后,我遇到了一些错误,因为它仍然再次进入 object.Object

我觉得我需要进一步深入研究才能以某种方式进入 releases.release,因为那是所有数据要呈现的地方。

您尝试循环的响应是代表 xml 文档的对象。 要访问发布数组,您必须使用 json["#document"].releases.release

var ul = $("<ul>").appendTo("body");
$.ajax({
  url: "https://s3-us-west-2.amazonaws.com/s.cdpn.io/8689/list.xml",
  dataType: "xml",
  success: function(response) {
    json = $.xml2json(response);
    let release = json["#document"].releases.release
    $(release).each(function(index, headline) {
      ul.append($(document.createElement("li")).text(headline.headline));
    });
  }
});

Example