タイトル、リンク、要約記事の表示のみであれば、RSS 2.0形式はRSS 1.0のスクリプトで処理することができます。
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>RSS2の見出しと記事内容を表示する</title>
<link rel="stylesheet" href="main.css" type="text/css" media="all">
<script type="text/javascript" src="xmlhttp.js"></script>
<script type="text/javascript"><!--
Safari = false;
if (navigator.userAgent.indexOf("Safari") > -1) Safari = true;
function rssSearch()
{
rssURL = $("siteURL").value;
httpObj = createXMLHttpRequest(displayData);
if (httpObj)
{
httpObj.open("GET","getrss.rb?query="+rssURL+"&cache="+(new Date()).getTime(),true);
httpObj.send(null);
}
}
function displayData()
{
if ((httpObj.readyState == 4) && (httpObj.status == 200))
{
parseRSS2(httpObj.responseXML);
}else{
$("result").innerHTML = "読み込み中です...";
}
}
// RSS 2.0 (RSS) を解析
function parseRSS2(sXML)
{
var resultText = rssTitle = rssLink = rssText = "";
var itemList = sXML.getElementsByTagName("item");
for (var i=0; i<itemList.length; i++)
{
if (Safari)
{
rssTitle = itemList[i].childNodes[1].childNodes[0].nodeValue;
rssLink = itemList[i].childNodes[3].childNodes[0].nodeValue;
try { rssText = itemList[i].childNodes[5].childNodes[0].nodeValue; }catch(e){ rssText = "" }
}else{
rssTitle = itemList[i].getElementsByTagName("title")[0].childNodes[0].nodeValue;
rssLink = itemList[i].getElementsByTagName("link")[0].childNodes[0].nodeValue;
try { rssText = itemList[i].getElementsByTagName("description")[0].childNodes[0].nodeValue; }catch(e){ rssText = "" }
}
resultText += '<a href="'+rssLink+'">'+rssTitle + '</a><div class="desc">'+rssText+'</div>';
}
$("result").innerHTML = resultText;
}
// --></script>
</head>
<body>
<h1>RSS2の見出しと記事内容を表示する</h1>
<form method="get" name="ajaxForm" onsubmit="rssSearch();return false;">
<select id="siteURL">
<option value="http://rss.news.yahoo.com/rss/nasashuttle">Yahoo.com - NASA -</option>
<option value="http://repo.jp/news/rss2.xml">REPO</option>
<option value="http://rss.fujitv.co.jp/whatsnew.xml">フジテレビ</option>
</select>
<input type="button" value="検索する" onClick="rssSearch()">
</form>
<div id="result"></div>
</div>
</body>
</html>
RSS 2.0ではdescription内にHTMLのタグが記述されることがあります。このサンプルでは、そのようなHTMLタグが含まれると、Internet Explorer 6では正しく処理されず表示されないことがあります。FirefoxやOperaでは正しく表示されます。
次項ではAtomの形式を解析してタイトル、リンク、要約記事を表示します。
[
第11章 4:Atomを読み込むへ]
[
目次へ]
(2006.1.29)