XML2JSON+javascriptテンプレートエンジンでRSS表示

drk7.jp さんでXML2JSON serviceという面白いサービスが開始されました。

ということで早速ハックしてみました。

前のエントリーで書いた Javascriptテンプレートと組み合わせてめちゃくちゃ簡単にRSSを表示できます。

サンプルはこちら

使い方ですが、多分ソースをみてもらったほうが速いです。

サンプルHTMLから抜粋

1Event.observe(window, "load", function(){
2        new XML2JSON("<a href="http://feeds.feedburner.com/Inforno">http://feeds.feedburner.com/Inforno</a>", {container: "test", template : {element:"template"}});
3});

初期化コードはｺﾚだけです。 containerでinnerHTMLに結果を流し込みたいElementを指定します。 templateは Lyase.View.render の引数と同じです。 例ではtextareaエレメントのid:“tempalte"のinnerHTMLをテンプレートとして扱います。

 1//テンプレート
 2  <textarea id="template" style="display:none;">
 3
 4<h3>< %= context.channel.title %></h3>
 5
 6<ul class="items">
 7      < % context.channel.item.each(function(item,index){%>
 8
 9    <li><a href="<%= item.link%>" target="_blank">< %= item.title%></a></li>
10        < % if(index > 5){throw $break;}%>
11      < %})%>
12   </ul>
13  </textarea>

こんな感じでテンプレートがかけるので、デザインの変更が大変楽になります。 またJSONデータ取得時のonloadを好きなメソッドに置き換えることもできるのでLyase.Viewを使わなくてもXML2JSONライブラリだけで おいしくいただけます。すきに改造してやってください、たいしたものじゃないですし（笑

comments powered by Disqus