RSSを取得する。

RSSをJSで取得して表示するプラグインです。
jquery-feeds

だいたいのつかいかた

$(function(){
 var template = '<div class="mb20">\
 <h3><a href="<!=link!>" target="_blank"><!=title!></a></h3>\
 <p><!=content!></p>\
 </div>';

 $('.rss1').feeds({
  feeds: {
   feed1: 'http://feeds.gizmodo.jp/rss/gizmodo/index.xml'
  },
  max: 5,
  entryTemplate: template
 });
});

最初のhtmlタグ群

後述しますが、RSSデータの表示用テンプレートの指定になります。

$('.rss1').feeds

取得したRSSデータをどこに出力するのか、を指定します。
feedの指定が複数ある場合は一回まとめて更新順にごちゃまぜで出してるみたいですね。

feeds:

RSSを取得する先の指定を行います。複数指定を行う事もできます。
基本的に key:'url' です。key名の規則はありません。

max:

RSS取得件数です。最新からX個までみたいな感じの指定です。
但し、feedを複数指定している場合は、各feedの最大件数となりますので
feedが２つの場合は合計の10記事が出てくるわけです。

entryTemplate:

RSS表示テンプレートの指定です。
特になければデフォルトで用意されているテンプレート指定で出力されます。
情報の呼び出し方は以下一部抜粋を参照ください。

で、上記をテンプレートの中に埋め込みます。
こんな感じです。

 <p><!=[情報名]></p>

少しカスタマイズ

上記の使い方は基本として、次にきまったフィードのみを表示したい場合どうすればよいか
少しカスタマイズしてみます。

$(function(){
 var template = '<div class="mb20">\
 <h3><a href="<!=link!>" target="_blank"><!=title!></a></h3>\
 <p><!=content!></p>\
 </div>';

 $('.rss1').feeds({
  feeds: {
   feed1: 'http://feeds.gizmodo.jp/rss/gizmodo/index.xml'
  },
  max: 5,
  entryTemplate: template
  ,preprocess : function(feed)
 {
  if($.inArray('サイエンス', this.categories) < 0)
  {
   return false;
 }
  }
 });
});

赤太字部分を追加しています。
preprocessですが、コールバックの１つで、feedが読み込まれたら実行されます。
その中で、categoriesの中に'サイエンス'がなければreturn false;を実行させ
該当のフィードの生成を切っています。
ここではcategoriesを見ていますが、前述している情報読み出しのキーを使うことで他条件での絞り込みもできちゃうわけですね。

※注意※
残念ながら、この絞り込みは既にfeedが指定件数読み込まれてからなので、条件に一致する記事がなければ件数は0件です。
読み込み時点での絞り込みは記事元がなんとかしてくれないとダメです。

デモ

２つ作ってみることにします。
通常の固定RSS読み込み
読み込み先の指定・絞り込み・件数指定ができるもの
自分用の何か