【Javascript】Ajaxを使おう　RSSリーダーを作る

 <?xml version="1.0" encoding="UTF-8" ?> 
- <feed>
	:
	:
	-<entry>
		<title>エントリー1</title> 
		<link rel="alternate" type="text/html" href="http://...." /> 
		<modified>2005-05-....</modified> 
		<issued>2005-05-31....</issued> 
				:
				:
	 </entry>
	-<entry>
		<title>エントリー2</title> 
		<link rel="alternate" type="text/html" href="http://...." /> 
		<modified>2005-05-....</modified> 
		<issued>2005-05-3....</issued> 
				:
				:
				
	 </entry>
 </feed>

<button onclick="rssReader('http://jsgt.org/mt/01/atom.xml')">
MobableType　のatom.xml</button><br>

<!-- JKL.ParseXMLを読み込む -->
<script type="text/javascript" src="./jkl-parsexml.js"></script>

<script>
<!--

//プログレスバー
var bar

//メイン関数
function rssReader(url)
{
	//プログレスバー開始
	document.getElementById('out1').innerHTML = ''
	bar = setInterval('progressbar()', 100 )

	// JKL.ParseXMLオブジェクトを生成
	var xml = new JKL.ParseXML( url );  
	var func = function ( data )        // 呼び出し先関数を定義する
	{  
		onloaded2( data );              //コールバック
	}
	xml.async( func );                  // 呼び出し先関数を指定する
	xml.parse();                        // ダウンロード～解析～関数呼び出しする
}


//RSSを受信時に起動するコールバック関数
function onloaded2(xml)
{
	var data =""

	//feed要素以下のentry要素を順番に処理
	for(i in xml.feed.entry)
	{
		//カテゴリがAjaxのみを出力する
		if(xml.feed.entry[i]["dc:subject"]=="Ajax")
		{
			//出力用HTMLを作る
			data += '<a href="'+xml.feed.entry[i].link.href+'">'

			//24文字に制限
			data += xml.feed.entry[i].title.substr(0,24)
			data += '</a>'
			data += '<br>'

			//時間を取り出す
			var time = xml.feed.entry[i].issued
				time = time.split("T").join(" ").split("+")[0]
			data += '('+time+')<br>'
		}
	}
	//プログレスバー停止
	clearInterval(bar)
	//出力
	document.getElementById('out1').innerHTML = data
}

//プログレスバー
function progressbar()
{
	document.getElementById('out1').innerHTML += '|'
}

//-->
</script>
<br />

<!-- ここへ出力します -->
<div id="out1" 
     style ="font-size:0.8em;margin:12px;" ></div>
     

<button onclick="rssOut4()">
MobableType　のatom.xml</button><br>

<!-- JKL.ParseXMLを読み込む -->
<script type="text/javascript" src="http://jsgt.org/ajax/ref/test/json/jkl/v0.07/jkl-parsexml.js"></script>

<script>
<!--

//プログレスバー
var bar
//プレロードしたデータ用
var data4 =""

//出力用DIV
document.write('<div id="out4" style ="font-size:0.8em;margin:12px;"></div>')

//プレロード
rssPreLoader4('http://jsgt.org/mt/01/atom.xml')
function rssPreLoader4(url)
{

	//プログレスバー開始
	document.getElementById('out4').innerHTML = 'pre loading...'
	bar = setInterval('progressbar4()', 100 )

	// JKL.ParseXMLオブジェクトを生成
	var xml = new JKL.ParseXML( url );  
	var func = function ( data4 )        // 呼び出し先関数を定義する
	{  
		onloaded4( data4 );              //コールバック
	}
	xml.async( func );                  // 呼び出し先関数を指定する
	xml.parse();                        // ダウンロード～解析～関数呼び出しする

}

//RSSを受信時に起動するコールバック関数
function onloaded4(xml)
{
	data4 =""
	
	//feed要素以下のentry要素を順番に処理
	for(i in xml.feed.entry)
	{
		//カテゴリがAjaxのみを出力する
		if(xml.feed.entry[i]["dc:subject"]=="Ajax")
		{
			//出力用HTMLを作る
			data4 += '<a href="'+xml.feed.entry[i].link.href+'">'

			//24文字に制限
			data4 += xml.feed.entry[i].title.substr(0,24)
			data4 += '</a>'
			data4 += '<br>'

			//時間を取り出す
			var time = xml.feed.entry[i].issued
				time = time.split("T").join(" ").split("+")[0]
			data4 += '('+time+')<br>'
		}
	}
	//プログレスバー停止
	clearInterval(bar)
	document.getElementById('out4').innerHTML = 'ok now loaded.'

	return data4
}

//出力
function rssOut4()
{
	//出力
	document.getElementById('out4').innerHTML = data4
}

//プログレスバー
function progressbar4()
{
	document.getElementById('out4').innerHTML += '|'
}

//-->
</script>