访问 在XML与JavaScript值

Question

我使用的Ajax / jQuery的从一个RSS feed一些内容来拉，但它似乎是无法读取名为“Link”的XML节点的内容。

下面是XML的简化版本：

<?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>

和代码我使用：

    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
         $('item', this.responseText).each(function(){
             var thisPostData = {};
             thisPostData.title = $(this).find('title').text();
             thisPostData.link = $(this).find('link').text();
             thisPostData.date = $(this).find('pubDate').text();
             posts.push(thisPostData);
          });
          console.log(posts);
       }
     };
   var posts = [];
   xhttp.open('GET', 'https://example.com/rssfeed/', true);
   xhttp.send();

你会看到，我想每一个“项目”添加到对象，并将它们存储在“帖子”数组中。 “标题”和“pubdate的”存储罚款，但“链接”不是。

有问题的实际RSS提要蕴含着巨大的额外的数据，所有这一切，我可以除了“链接”节点阅读量。任何建议，为什么节点名为“Link”将与所有其他不同的行动？

Answer 1

问题是，因为你正在试图解析XML作为HTML。在HTML中<link>对象是内嵌元素，而不是块级之一，所以它没有textContent属性jQuery来读取，因此输出是空的。

为了解决这个问题首先使用$.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...
  }
});