2010年3月8日月曜日

「SUZ-LAB FEED」で「AWS+」のサポーター(?)フィードを作成(その2)

スズキです。

「その1」でフィードができたので、次は、そのフィードを読み込んで表示する部分です。
http://feed.suz-lab.com/feed.xml/aws-plus_news

今回は"Google AJAX FEED API"を利用して、お手軽に作ってみました。
http://code.google.com/intl/ja/apis/ajaxfeeds/documentation/

コードは下記のような感じです。

--------【JavaScript】--------
<script type="text/JavaScript" src="/js/jquery.js"></script>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">google.load("feeds", "1");</script>
<script>
$(function() {
  var url = "http://feed.suz-lab.com/feed.xml/aws-plus_news";
  var feed = new google.feeds.Feed(url);
  feed.setNumEntries(20);
  feed.load(function(result) {
    if(!result.error) {
      var html = "";
      $.each(result.feed.entries, function() {
        var date = new Date(Date.parse(this.publishedDate));
        html += "<dt>";
        html += date.getFullYear();
        html += ".";
        html += ("0" + (date.getMonth() + 1)).slice(-2);
        html += ".";
        html += ("0" + date.getDate()).slice(-2);
        html += "</dt>";
        html += "<dd>";
        html += "<a target='_blank' href='" + this.link + "'>";
        html += this.title;
        html += "</a>";
        html += " [" + this.author + "]";
        html += "</dd>";
      });
      $("#entry").html(html);
    }
  });
});
</script>
--------

実際に動いてるものは、こちらになります。
http://www.aws-plus.com/

「SUZ-LAB FEED」の二つ目の事例です。

--------
http://www.suz-lab.com

0 コメント: