如何動態讀取RSS

Question

我想使用jQuery讀取多個RSS源。

我想寫一個靈活的功能，只需要RSS網址，它會輸出只有它的標題和圖像如何做到這一點的多個RSS網址？

Answer 1

最簡單的方法是使用Google AJAX Feed API。他們有一個really simple example，適合你想要什麼好聽：

<script type="text/javascript" src="http://www.google.com/jsapi"></script> 
<script type="text/javascript"> 

google.load("feeds", "1"); 

function initialize() { 
    var feed = new google.feeds.Feed("http://www.digg.com/rss/index.xml"); 
    feed.load(function(result) { 
    if (!result.error) { 
     var container = document.getElementById("feed"); 
     for (var i = 0; i < result.feed.entries.length; i++) { 
     var entry = result.feed.entries[i]; 
     var div = document.createElement("div"); 
     div.appendChild(document.createTextNode(entry.title)); 
     container.appendChild(div); 
     } 
    } 
    }); 
} 
google.setOnLoadCallback(initialize); 

</script> 
<div id="feed"></div> 

當然，你可以用API，而不是使用本地DOM調用混合jQuery的。

Answer 2

你見過這個jQuery插件：http://plugins.jquery.com/project/jFeed

Answer 3

晚會有點晚，但我實際上做了一些類似的使用deviantART畫廊飼料和顯示最新的縮略圖。我把它包成易於使用幾個功能：

function keratin_callback(elem, data) 
{ 
    if (!data 
     || !data.entries 
     || data.entries.length < 1 
     || !data.entries[0].mediaGroups 
     || data.entries[0].mediaGroups.length < 1 
     || !data.entries[0].mediaGroups[0].contents 
     || data.entries[0].mediaGroups[0].contents.length < 1 
     || !data.entries[0].mediaGroups[0].contents[0].thumbnails 
     || data.entries[0].mediaGroups[0].contents[0].thumbnails.length < 1) { 
     $("<span>Data returned from feed not in expected format.</span>").appendTo(elem); 
     return; 
    } 

    var entry = data.entries[0]; 
    $("<img>").attr("src", entry.mediaGroups[0].contents[0].thumbnails[0].url) 
       .appendTo(elem) 
       .wrap("<a href="" + entry.link + "" title="Title: " + entry.title + "\nPublished: " + entry.publishedDate + "" rel="related" target="_blank"></a>"); 
} 

function keratin(elem, url) 
{ 
    //keratin written by adam james naylor - www.adamjamesnaylor.com 
    if (!elem || elem.length < 1) return; //no element found 
    $.ajax({ 
     //you could use document.location.protocol on the below line if your site uses HTTPS 
     url: 'http:' + '//ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&callback=?&q=' + encodeURIComponent(url + '&cache=' + Date.UTC()), 
     dataType: 'json', 
     success: function(data) { 
      if (!data || !data.responseData) { 
       return keratin_callback(elem, null); 
      } 
      return keratin_callback(elem, data.responseData.feed); 
     } 
    }); 
} 

$(document).ready(function() { 
    keratin($('#da_gallery'), 'http://backend.deviantart.com/rss.xml?q=gallery%3Adeusuk%2F28671222&type=deviation') 
}); 

全部細節在這裏：http://www.adamjamesnaylor.com/2012/11/05/Keratin-DeviantART-Latest-Deviation-Widget.aspx