[ jQuery ] 同じドメイン内の RSS を読み込んで表示するサンプル

同じドメイン内の RSS を読み込んで表示する jQuery サンプルを見つけたので試してみました。

サンプルコード ———————————————————————-

サンプルコードは次のようになります。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
  $.ajax({
    url: "/?feed=rss2",
    cache: false,
    dataType:"xml",
    success: function(xml){
      $(xml).find('item').each(function(){
        var title = $(this).find('title').text();
        var url = $(this).find('link').attr('href')
        $('<li></li>').html('<a href="'+url+'">'+title+'</a>').appendTo('ul#feedList');
        });
    }
  });
});
</script>

<ul id="feedList"></ul>

– https://bowz.info/ の RSS を読み込むサンプル

ただ、記事の日付に関しては、RSS のソース上で [ Fri, 27 Jan 2012 03:00:48 +0000 ] みたいな表記になっているため、[ 2012-01-27 ] みたいな表記に変更するのが大変なので、日付の表示は諦めた。

クロスドメインの場合はもう少しややこしいです ———————————————————————-

上記のコードは同じドメイン内なので簡単ですが、JavaScript はセキュリティーの仕様上、外部サイト ( クロスドメイン ) のデータは読めないようになっているらしいので、外部サイトの場合は少し面倒です。

クロスドメインの場合は、jFeedMixer を使った方法があります。

参考にさせてもらったページ ———————————————————————-

– xingxx – RSSリーダーはJavascript+jQueryでたった14行で作れる

ありがとうございます！