使用JavaScript分析XML文件中的链接

Parsing links from an XML files with JavaScript

本文关键字：链接 文件 XML JavaScript 分析 使用      更新时间：2023-09-26

为了在不同的页面上显示我最新的博客文章，我想解析博客中的rss提要，然后用它生成元素。

我首先尝试解析一个固定的.xml文件，为此我编写了以下代码：

    var maxBlogposts = 5;
    var blogPosts = 0;
     $.get("rss.xml", function(data) {
        $(data).find("item").each(function() {
            if(blogPosts === maxBlogposts) return;
            var el = $(this);
            //Only display 3 posts on small devices.
            var extra = (blogPosts >= 3) ? "not-small 12u(small)" : "12u(small)";
            var div = $('<div class="6u ' + extra + '" class="blog-entry"></div>');
            var h = $('<h4><a href="' + el.find("link").text() + '">' + el.find("title").text() + '</a></h4>');
            var description = el.find("description").text().replace('[&#8230;]', '<a href="' + el.find("link").text() + '">[&#8230;]</a>');
            var p = $('<p>' + description + '</p>');
            div.append(h);
            div.append(p);
            $('#blog').append(div);
            blogPosts++;
        });
    });

这个操作非常好。现在我想解析实际的rss提要。为此，我编写了一个PHP脚本，它只需获取提要并对其进行回声处理

<?php
$rss = file_get_contents('http://xn--der-grne-baum-1ob.net/feed/');
die($rss);
?>

我再次在前端获得了正确的XML文件。

我遇到的问题是，现在我的代码不再工作。获取描述和链接都失败了。我通过访问修复了描述

 el.find(description")[0].innerHTML

然而，我似乎无法获得工作链接。从PHP文件返回的数据包含一个带有链接的节点。"el"-元素还包含名为"link"的子元素，但这些子元素不再包含实际的链接。

我觉得链接在解析过程中可能会被"转义"？至少这是我能想到的唯一原因，这将导致我所观察到的。

我正在解析的XML来自http://xn--der-grne-baum-1ob.net/feed/

尝试

var maxBlogposts = 5
, blogPosts = 0;
$.get("https://query.yahooapis.com/v1/public/yql?q=select"
     + " * from feed where url='http://xn--der-grne-baum-1ob.net/feed/'")
.then(function(data) {
  $(data.documentElement).find("results item")
  .each(function() {
            if(blogPosts === maxBlogposts) return;
            var el = $(this);
            //Only display 3 posts on small devices.
            var extra = (blogPosts >= 3) ? "not-small 12u(small)" : "12u(small)";
            var div = $('<div class="6u ' + extra + '" class="blog-entry"></div>');
            var h = $('<h4><a href="' + el.find("link").text() + '">' + el.find("title").text() + '</a></h4>');
            var description = el.find("description").text().replace('[&#8230;]', '<a href="' + el.find("link").text() + '">[&#8230;]</a>');
            var p = $('<p>' + description + '</p>');
            div.append(h);
            div.append(p);
            $('#blog').append(div);
            blogPosts++;
        });
  }, function(jqxhr, textStatus, errorThrown) {
     console.log(textStatus, errorThrown)
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="blog"></div>

请参阅YQL控制台

相关文章：