タグ: jQuery

ちょっと色々試してみました。基本的にはRSS2.0前提で。

その1: jQueryの$.Ajax()を使ってベタでやる

$.ajax({
  url: url,
  type: 'GET',
  dataType: 'xml',
  success: function(data){
    feed = $(data).find('item');
    for(var i=0; i<feed.lenth; i++){
      $("#content").append($(feed[i]).find('title').text() + '<br />');
    }
  }
});

…コレでも簡単だけど、個人的にはjQueryのfind()があんまり好きじゃないのと、ちょっと面倒な気がする。

その2: jFeedプラグイン

http://www.hovinne.com/blog/index.php/2007/07/15/132-jfeed-jquery-rss-atom-feed-parser-plugin
RSS1.0/RSS2.0/ATOMのFeedの取得のためのプラグインみたい。

$.getFeed({
  url: url,
  success: function(feed){
    $('#content').append('<h2>' + feed.title + '</h2>');
    items = '';
    for(var i=0; i<feed.items.length; i++){
      var item = feed.items[i];
      items += item.title + '<br />'
    }
    $('#main section').append(items);
  }
);

イイ感じだけどjFeedで取れる要素はchannelのtitle/link/description/language/updatedとitemのtitle/link/description/updated/id(?)のみで固定。item要素のauthorとかcategoryとかは無視されるみたい。（自動的に取ってくれれば良いのに）
それは、ちょっと、困る。

その3: jParseプラグイン

http://jparse.kylerush.net/
elementTagで指定した順番に jpet00, jpet01…って順番で output の中で出力形式決めて、指定した要素に突っ込んでくれます。

$("#content").jParse({
  ajaxOpts: {url: url},
  elementTag: ['title', 'link', 'description'],
  output: '<a href="jpet01">jpet00</a><br />'
});

おお、コレは楽で良いけど・・・channelの要素取るのどうすんだ？？

その4: PHPでJSONにして$.getJSON()で受ける

他のドメインのXMLを取る場合どちらにせよProxy的な処理を挟むので、こんなPHP(proxy_parser.php)をローカルに書いて XML をそのまんま JSON に変換します。

$url = $_GET['url'];
$xmlobj = simplexml_load_file($url, 'SimpleXMLElement', LIBXML_NOCDATA);
print(json_encode($obj));

で、jQuery.getJSONを使って取り出します。

$.getJSON('proxy_parser.php',{url: url}, function(data){
  $("#content").append('<h2>' + data.channel.title + '</h2>');
  var items = data.channel.item;
  for(var i=0; i<items.length; i++){
    $("#content").append(items[i].title + '<br />');
  }
});

何でもかんでもJSONで処理する人間としては、自由度も高いしこのやり方が楽で良いかなぁなんて思ってます。
このproxy_parser.phpもちょっと弄ればそのまま ExtJS に流し込めそうな気がする。