久しぶりにAPIをいじってみることにしました。今回いじったのはtumblrのAPI、tumblrで艦これブログを書いているので、そのブログのエントリー名とURLを取得して記事一覧を表示させるのが目的です。表示させる記事タイトルは５件としました。最初はPHPで出力させようと思ったのですが、jQueryでも対応できるようなので今回はjQueryを採用しました。

• ドメインと取得した任意のAPIキーを記述します。
• ５件表示なので「limit=5」とします。
• 取得したらクラス名「tumbler-post-list」にコンテンツを追加するように書きます。
• 下記のjQueryは外部ファイル化して読み込むようにしてあります

$(function(){
domain ="xxxx.tumblr.com";
api_key ="任意のAPIキー";
$.getJSON(
"http://api.tumblr.com/v2/blog/"+domain+"/posts?api_key="+api_key+"&limit=5&jsonp=?",
function(data){
if( data['meta']['status']!=200){
return;//取得失敗なので終了。
}
$.each(data['response']['posts'],function(){
$(".tumbler-post-list").append('<li>'+'<a href="' +this['post_url']+'">' +this['title'] +'</a></li>');
});
}
);
});

html側は下記のように書いておけばDOMの構築時に追加されます。

<ul class="tumbler-post-list">
</ul>