使用Javascript访问XML中的<link />值

时间:2019-02-05 14:17:18

标签: javascript jquery ajax xml rss

我正在使用Ajax / jQuery从RSS feed中提取一些内容,但是似乎无法读取名称为“ link”的XML节点的内容。

这是XML的简化版本:

Create or replace trigger initial_turn
after insert on Recap_turn
for each row
when (new.turn_number=0)
declare 
    i integer;
    PRAGMA AUTONOMOUS_TRANSACTION;
BEGIN
    i:=3000;
    update Recap_turn
    set bank_account_amount=i
    where (id_turn=:new.id_turn); commit;
end;

我正在使用的代码:

<?xml version="1.0" encoding="UTF-8"?>
  <channel>
    <item>
      <title>Title one</title>
      <link>https://example.com/</link>
      <pubDate>Mon, 12 Feb 2019</pubDate>
    </item>
    <item>...</item>
    <item>...</item>
  </channel>
</xml>

您将看到我正在尝试将每个“项目”添加到一个对象,并将其存储在“ posts”数组中。 'Title'和'pubDate'可以很好地存储,但'link'则不能。

有问题的实际RSS提要包含大量额外的数据,除“链接”节点外,所有这些数据我都可以阅读。有什么建议为什么称为“链接”的节点会与其他节点有所不同?

1 个答案:

答案 0 :(得分:3)

问题是因为您试图将XML解析为HTML。 HTML中的<link>对象是一个内联元素,而不是块级别的第一个元素,因此它没有jQuery的textContent属性,因此输出为空。

要解决此问题,请先使用$.parseXML()读取XML,然后然后将其放在您可以遍历的jQuery对象中。

还有两件事要注意。首先,您将需要删除XML输出末尾的</xml>节点,因为它是无效的,并且在运行$.parseXML时会导致错误。其次,您可以使用map()来构建数组,而不是在数组上手动调用push(),您可以直接从中返回对象定义。试试这个:

var responseText = '<?xml version="1.0" encoding="UTF-8"?><channel><item><title>Title one</title><link>https://example.com/</link><pubDate>Mon, 12 Feb 2019</pubDate></item><item><title>Title two</title><link>https://foo.com/</link><pubDate>Tue, 13 Feb 2019</pubDate></item></channel>';

var xmlDoc = $.parseXML(responseText)
var posts = $('item', xmlDoc).map(function() {
  var $item = $(this);
  return {
    title: $item.find('title').text(),
    link: $item.find('link').text(),
    date: $item.find('pubDate').text()
  };
}).get();

console.log(posts);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

最后,您使用的是JS和jQuery的比较奇怪的组合。我建议一起去。因此,这是一个完整的jQuery实现,其中也包含AJAX请求:

$.ajax({
  url: 'https://example.com/rssfeed/',
  success: function(responseText) {
    var xmlDoc = $.parseXML(responseText)
    var posts = $('item', xmlDoc).map(function() {
      var $item = $(this);
      return {
        title: $item.find('title').text(),
        link: $item.find('link').text(),
        date: $item.find('pubDate').text()
      };
    }).get();
    
    // work with posts here...
  }
});