Script
(function($){
$.fn.twLine = function(options){
var c = $.extend({
//ユーザーIDもしくはスクリーン名
user: null,
number: 10
},options || {});
var twiUrl = 'http://twitter.com/';
$(this).each(function(){
var self = $(this);
// ユーザー名がなければ処理を終了する
if( !c.user ) {
return false;
}
// loading文字列とJSONの中身を一覧で表示するためのul要素を入れておく
self.append(
'<div class="loading"><img src="images/loading.gif" width="32" height="32" alt="" />loading...</div>',
'<ul/>'
);
// JSONの取得
$.getJSON('http://twitter.com/statuses/user_timeline/' + c.user +'.json?callback=?',function(data){
// loading文字列を消去
$('.loading', self).remove();
// ポストがひとつもなかった場合
if( data.length < 1 ) {
$('ul', self).append('<li>投稿がありません。</li>');
return false;
}
// item毎に・・・
$.each(data , function(i , items) {
// 指定した数を超えた場合は終了する
if( i > (c.number - 1) ) {
return false;
}
var txt = items.text;
// 各種リンク付きに置換する
txt = txt.replace(/(http:\/\/[\x21-\x7e]+)/gi,'<a href="$1">$1</a>')
.replace(/#(\w+)/g,'<a href="'+twiUrl+'#search?q=%23$1">#$1</a>')
.replace(/\@(\w+)/g,'<a href="'+twiUrl+'$1">@$1</a>');
// itemの中のtextを抜き出してulに追加する
$('ul', self).append(
$('<li/>').html(txt)
);
});
});
});
}
})(jQuery);
jQuery(function($){
$('#demo').twLine({
user: '32262053'
});
$('#demo2').twLine({
user: 'h2ham',
number: 5
});
});
HTML
<div id="demo">
<h4>@5509のつぶやき</h4>
</div>
<div id="demo2">
<h4>@h2hamのつぶやき</h4>
</div>
Demo
@5509のつぶやき
@h2hamのつぶやき