sample.html // 表示用HTMLファイル
beseDir // ベースディレクトリ
├ bookMarks.cgi // 本体プログラム
|
├ SNS // カテゴリ別ディレクトリ
| ├ Facebook.URL // ショートカットファイル
| ├ Twitter.URL
| └ mixi(ミクシィ).URL
|
├ Games // カテゴリ別ディレクトリ
| ├ GREE.URL // ショートカットファイル
| ├ Mobage(モバゲー).URL
| └ ガンホーゲームズ.URL
|
└ Blogs // カテゴリ別ディレクトリ
├ Ameba 無料ブログ.URL
├ FC2ブログ.URL
├ Yahoo!ブログ.URL
└ ライブドアブログ.URL
bookMarks.cgi
を対象WEBサーバにFTPでアップロードして下さい。
bookMarks.cgi
のファイル権限を700
又は、744
に変更して下さい。
本体ファイルbookMarks.cgi
にアクセスすると、カテゴリとショートカットファイルの一覧XMLをレスポンスします。
$.ajax({
url: './bookMarks.cgi',
type: 'get',
dataType: 'xml',
timeout: 1000,
error: function(){
alert('Error loading XML document');
},
success: function(xml){
// ここにXML取得後の加工/表示処理を記載
}
});
レスポンスで戻ってきたXMLをページのデザインに従って編集/加工/表示処理を行って下さい。
jQueryでのXML加工/表示例
$.ajax({
// 〜省略〜
success: function(xml){
// 加工処理
var bookmarkList= $('
');
$(xml).find('Site').each(function() {
bookmarkList.append('- ' + $(this).find('siteName').text() + '
');
var siteDetail += 'Site URL: ' + $(this).find('siteUrl').text() + '
';
siteDetail += 'Site Category: ' + $(this).find('siteCategory').text() + '
';
siteDetail += 'Site Memo: ' + $(this).find('siteExp').text() + '
';
siteDetail += 'Site Thumbnail: ';
bookmarkList.append('- ' + siteDetail + '
');
});
// 表示処理
$('#bookMarks').append(bookmarkList);
}
});