RSSフィード取得して表示「Google AJAX Feed API」


「Google AJAX Feed API」を使用すると、JavaScript だけを使用して公開されている Atom フィードや RSS フィードをダウンロードできます。
まずはGoogle AJAX Feed API に登録してAPIキーを取得。
あとはGoogle AJAX Feed APIデベロッパーガイドを参考に記述。以下サンプル。

Loading

サンプルコード:

<script type="text/javascript" src="http://www.google.com/jsapi?key=APIキー"></script>
<script type="text/javascript">
 google.load("feeds", "1");
 function initialize() {
 var feedControl = new google.feeds.FeedControl();
 feedControl.addFeed("http://dailynews.yahoo.co.jp/fc/rss.xml", "Yahoo!ニュース・トピックス");
 feedControl.addFeed("http://www.sanspo.com/rss/chumoku/news/allsports-n.xml", "SANSPO.COMニュース");
 feedControl.setNumEntries(10);
 feedControl.draw(document.getElementById("feedControl"));
 feedControl.setLinkTarget(google.feeds.LINK_TARGET_BLANK);
 }
 google.setOnLoadCallback(initialize);
 </script>
<style type="text/css">
#feedControl {
 font-size: 12px;
 width : 300px;
}
#feedControl .gf-relativePublishedDate {
 display : none;
}
#feedControl .gfc-results {
 padding-bottom : 1.1em;
 padding-left: 10px;
}
#feedControl .gfc-result {
 font-weight: bold;
 margin-bottom : 5px;
 border-bottom:1px dotted #555555;
}
#feedControl .gfc-resultsHeader .gfc-title {
 font-size : 15px;
 font-weight: bold;
 color: #000000;
}
</style>
<div id="feedControl">Loading</div>

関連記事