2009年11月16日

Ajaxを利用する命令 XMLを取得・操作するajax()

人気ブログランキングにほんブログ村 IT技術ブログへ

ASCII.jp:jQueryでAjaxを利用する基本チュートリアル|Web制作の現場で使えるjQuery UIデザイン入門

上記リンクを参考に実際に書いてみた。

ajax()という命令を使い、このブログのrssを取得してみました。

チュートリアルでは<discription>で記事の概要を取得していますが、このブログは私の書き方が悪く現時点で概要にすべての内容を書いています。

ですので<discription>のかわりには<pubDate>で更新日時を表示しています。


コードは以下の通り。
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
$.ajax({
url:'http://webdesign.naganoblog.jp/index.xml',
dataType:'xml',
success:function(data){
$("item",data).each(function(){
$("#ajax dl").append("
"+$("title",this).text()+"
"+$("pubDate",this).text()+"
");
});
}
});
})
</script>

<div id="ajax">
<dl></dl>
</div>


同じカテゴリー(jQuery)の記事画像
jQueryでIE6を透過PNGに対応させる
jQueryで作るロールオーバー
jQueryで作るオリジナルツールチップ
jQueryでのアニメーション animate()
jQueryのアニメーションfadeIn Out To
jQueryのアニメーションslideUp Down 他
同じカテゴリー(jQuery)の記事
 jQueryでIE6を透過PNGに対応させる (2009-12-16 20:34)
 jQueryで作るロールオーバー (2009-12-12 18:00)
 jQueryで作るオリジナルツールチップ (2009-12-11 23:44)
 jQueryで作るタブパネル (2009-12-10 18:00)
 jQueryで作るアコーディオンパネル (2009-12-09 18:00)
 jQueryでイメージギャラリーを作成。 (2009-11-29 17:58)

Posted by ヒダカ at 18:18│Comments(0)jQuery
上の画像に書かれている文字を入力して下さい
 
<ご注意>
書き込まれた内容は公開され、ブログの持ち主だけが削除できます。