当 img 在 CDATA 中时,如何 AJAX 从 RSS/XML 加载博客图片

How to AJAX load a blog image from RSS/XML when img is in CDATA

当 img 在 CDATA 中时,如何 AJAX 从 RSS/XML 加载博客图像?

我可以从我们的博客 RSS 提要中加载标题、url、发布日期等...,但我不知道如何定位图像。我从 this 脚本开始并修改它以获得这个:

$.ajax({
type: "GET",
url: "http://www.example.com/blog/feed",
dataType: "xml",

success: function(xml) {

    var contain = $("div#blogSection");
    var limit = 1;

    $(xml).find('item').each(function(index){
    if( index < limit ){

        var title = $(this).find('title').text();
        var url = $(this).find('link').text();
        var pubDate = $(this).find('pubDate').text();
        var img = $(this).find('content:encoded > p > img').attr('src').text();
        var desc = $(this).find('description > p:first').text();

        $('<div class="blogFeed"></div>').html('<div class="feedThumbnail"><img src="'+img+'" class="resizable" title="blog image" alt="blog image"></div><div class="feedExcerpt"><h3 class="title"><a href="'+url+'">'+title+'</a></h3><p>'+desc+'</p><p><a class="allLink" href="'+url+'" title="read more" alt="read more" target="_blank">read more</a></p></div>').appendTo(contain);
        return;
        }
        });//end each
    }
});

我认为问题出在 xml 中的 CDATA 中,正如我所读到的那样,它将其中的所有内容都解释为字符数据。 xml 看起来像这样:

<item>
    <title>Title</title>
    <link>Link</link>
    <comments>Comments</comments>
    <pubDate>Date</pubDate>
    <description><![CDATA[Description]]></description>
    <content:encoded><![CDATA[<p><img src="http://www.example.com/img.jpg"...]]></content:encoded>
</item>

如果我认为是 CDATA 导致它无法定位是正确的,那么我可以在我的 ajax 代码中做些什么来定位图像和第一段?如果我错了,我应该add/remove?

谢谢!

适用于所有浏览器:

我替换了这个:

var img = $(this).find('content:encoded > p > img').attr('src').text();

有了这个:

var img = $(this).find('content\:encoded, encoded').text();
img = $.parseHTML(img);
img = img[0].firstChild.src;

我转义了'content:encoded'中的特殊字符并添加了“, encoded”。添加 $.parseHTML 后,console.log(img);揭示了 src 的位置。返回 .text() 删除了 CDATA,我现在怀疑 CDATA 是无关紧要的。几天的博客图像测试。希望它能帮助其他人节省时间。