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

Question

我正在尝试测试我的想法，但使用这个 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));
    });
  }
});

问题是当它呈现出来时，返回的只是单个li中的[object Object] 。

所以，我知道我做错了什么，但我不确定我需要在何处以及在什么时候进行转换以获取数据，以便我可以呈现headline 、 releaseDate等等。

我在这里创建了一个 Codepen： https ://codepen.io/ultraloveninja/pen/YzPRjRw

我读过我可能需要使用jQuery.parseJSON但是在测试了一下之后，我得到了一些错误，因为它仍然再次进入那个object.Object 。

我觉得我需要更深入地了解releases.release以某种方式获取内容，因为这是所有数据要呈现的地方。

Answer 1

您尝试循环的响应是一个表示 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));
    });
  }
});

例子