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



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

最新更新