jQueryを利用してDeliciousのブックマーク数を表示する

このブログにjQueryを利用してDeliciousのブックマーク数を表示してみましたので、やり方を紹介しておきます。

DeliciousはjsonpのAPIを公開していますので、同一ドメインの制約を受けずAjaxで情報を取得することが出来ます。

jsonpの情報は次のようなURLで取得できます。

http://feeds.delicious.com/v2/json/urlinfo/[md5ハッシュ化したURL]

URLをmd5ハッシュ化しなくてはいけないのですが、それにはmd5.jsを利用して行いました。

$(function(){
	var md5hash = MD5_hexhash(location.href);
	$.ajax({
		type: 'GET',
		dataType: 'jsonp',
		url: 'http://feeds.delicious.com/v2/json/urlinfo/' + md5hash,
		success: function(data){
			if (data.length > 0){
				$('#delicious').html('<a href="http://delicious.com/url/'+ md5hash + '">' + data[0].total_posts + 'user</a>');
			}
		}
	})
});

このスクリプトでid属性が「delicious」の要素の内側が「10 user」などといったリンクに切り替わります。

関連エントリー

jQuery基礎文法最速マスター
8の jQueryのすごいTIPS
jQueryを良くする25のTIPS
jQueryのコードを良くする5つのTIPS
JSONとJSONP

Web制作の現場で使う jQueryデザイン入門 (WEB PROFESSIONAL)Web制作の現場で使う jQueryデザイン入門

実務で使えるサンプル100本超の作成を通じて、手を動かしながらjQueryの基礎からしっかり学べる1冊です。

スポンサードリンク

«Fireworksでfaviconを作成 | メイン | iPhone用CSSをメディアクエリで分岐する問題点»