最近のブログタイトルを表示-２

前回の記事で、niftyのブログ記事のタイトルを取得する為、RSSリーダーの設定をしましたが、元々、参考にさせていただいたのは、

JavaScript で外部サイトのフィードを取得 - Google AJAX Feed API を利用の

6. フィードを取得するためのソースコード　

に記載されていたソースコードです。

こちらのソースコードを借用し、自分の目的に合わせて、そぎ落とし、自分のブログから情報を取り出せるように修正しました

【ソースコード】
script type="text/javascript" src="http://www.google.com/jsapi"></script
<script>
var blog = {
feedurl: "https://anocora.cocolog-nifty.com/blog/index.rdf",　//自分のブログのRSSを表示するURL
numOfPost: 7, // 1 ページに表示する投稿数
url: "http://jutememo.blogspot.com/"　//自分のブログのURL
}

// エントリーのタイトルをリンク付きにして div 要素に入れて返す。
function createTitleWithLink(entry, idx){
var div = document.createElement("div"); var anchor = document.createElement("a");
anchor.href = entry.link;
anchor.setAttribute("name", idx);
anchor.appendChild(document.createTextNode(entry.title));
div.className = "title";
div.appendChild(anchor);
return div;
}
google.load("feeds", "1");
function initialize() {
var feed = new google.feeds.Feed(blog.feedurl);
feed.setNumEntries(blog.numOfPost)
feed.load(function(result) {
  if (!result.error) {
   var divFeed = document.getElementById("feed");
   for (var i = 0; i < result.feed.entries.length; i++) {
    var entry = result.feed.entries[i];
    // フィードのタイトルを生成
    divFeed.appendChild(createTitleWithLink(entry, i));
   }
  }
  });
}
google.setOnLoadCallback(initialize);
</script>

動作を確認しながらそぎ落としていったので、まだ不要なスクリプトが残っているかも知れませんが、一応、目的は達成できています。

【HTML】
<!-- フィードの内容 -->
   <div id="feed"></div>

表示エリアの設定はこれだけです。

これを、従来のあのこらのホームページに追加しました。

動作確認用に作成した、WEBページは
http://www.anocora.com/anocora/newpage15.htmlに残してあります。