YQLでブログのRSSをJSONで取得して、新着として表示する

JavaScript

YQL Consoleで取得したいブログのRSSを、SQLっぽい構文で入力して確認してみます。
このブログのRSSで確認してみました。JSONで欲しいので、JSONにチェックを入れて TESTをクリック。
あ、*ではなく、titleとlinkだけ取ってます。

query.results.itemで一覧を取得できてますね*1。
後はそれを使って表示するだけです。

  <script type="text/javascript" src="javascripts/jquery-1.7.2.min.js"></script>
  <script type="text/javascript">

    function makeWhatsNewLiElement(item) {
      return "<li><a href='"+ item.link + "'>" + item.title + "</a></li>";
    }

   jQuery(function () {
      if(!Array.isArray) {
        Array.isArray = function (arg) {
          return Object.prototype.toString.call(arg) === "[object Array]";
        };
      }
      jQuery.getJSON("http://query.yahooapis.com/v1/public/yql?callback=?", {
        q : "select title,link from rss where url='http://d.hatena.ne.jp/yuichi_katahira/rss'",
        format : "json"
      }, function (json) {
        var whatsNew = jQuery(".whatsnew");
        if (Array.isArray(json.query.results.item)){
          for (var i = 0, l = json.query.results.item.length; i < l; i++) {
            whatsNew.append(makeWhatsNewLiElement(json.query.results.item[i]));
          }
        }else {
          //エントリーが１件しかなかった時は配列ではなくObject
          whatsNew.append(makeWhatsNewLiElement(json.query.results.item));
        }
      });
    });
  </script>
</head>
<body>
<ul class="whatsnew">
</ul>

まだエントリーがない別のブログで、試しに１件だけ記事を書いて取得してみたところ、query.results.itemが配列ではなく、Objectで来ていたので、その場合の対応も追加してみました。



YQLの制限はpublicの場合は下記の通りなので、アクセスが多いサイトでなければ十分かと思います。

Per IP limits: /v1/public/*: 2,000 calls per hour; /v1/yql/*: 20,000 calls per hour


以上。

参考

*1:オリジナルサイズで表示しないと見えづらいです