RSS 1.0 (RDF) の記事のタイトルは前項で取得できました。ここでは、見出しをクリックしたら該当する記事があるページにリンクさせます。リンク先はitemタグの中にあるlinkタグの最初のテキストノードに記述されています。
<rdf:RDF>
<channel>
<title>〜</title>
<link>〜<link>
<description>〜<description>
</channel>
<item>
<title>〜</title>
<link>〜</link>
</item>
</rdf:RDF>
リンク先を読み出し、aタグのhref属性に設定すれば見出しをクリックした時に該当するページを表示させることができます。（実際のサンプルを
実行する）
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>RSSを読み込む（タイトル＆リンク） (RSS 1.0 - RDF -)</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))
{
parseRSS1(httpObj.responseXML);
}else{
$("result").innerHTML = "読み込み中です...";
}
}
// RSS 1.0 (RDF) を解析
function parseRSS1(sXML)
{
var resultText = rssTitle = rssLink = "";
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;
}else{
rssTitle = itemList[i].getElementsByTagName("title")[0].childNodes[0].nodeValue;
rssLink = itemList[i].getElementsByTagName("link")[0].childNodes[0].nodeValue;
}
resultText += '<a href="'+rssLink+'">'+rssTitle + "</a><br>";
}
$("result").innerHTML = resultText;
}
// --></script>
</head>
<body>
<h1>RSSを読み込む（タイトル＆リンク） (RSS 1.0 - RDF -) (RSS 1.0 - RDF -)</h1>
<form method="get" name="ajaxForm" onsubmit="rssSearch();return false;">
<select id="siteURL">
<option value="http://hotwired.goo.ne.jp/news/index.rdf">Wired</option>
<option value="http://japan.cnet.com/rss/index.rdf">CNET</option>
<option value="http://www3.asahi.com/rss/index.rdf">Asahi.com</option>
<option value="http://nikkeibp.jp/jp/flash/index.rdf">日経BP</option>
<option value="http://japan.zdnet.com/rss/news/index.rdf">ZDNET</option>
</select>
<input type="button" value="検索する" onClick="rssSearch()">
</form>
<div id="result"></div>
</div>
</body>
</html>
次に記事の要約を表示させます。要約を示すタグはdescriptionで以下の位置になります。
<rdf:RDF>
<channel>
<title>〜</title>
<link>〜<link>
<description>〜<description>
</channel>
<item>
<title>〜</title>
<link>〜</link>
<description>〜</description>
</item>
</rdf:RDF>
ただし、記事の要約は必須項目ではありません。このため、要約記事があるかどうか確認する必要があります。チェックする場合にはいくつか方法がありますが、ここではtry...catchを使ってエラーの場合には記事がないことにして処理を継続させます。（サンプルを
実行する）
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>RSSの見出しと記事内容を表示する (RSS 1.0 - RDF -)</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))
{
parseRSS1(httpObj.responseXML);
}else{
$("result").innerHTML = "読み込み中です...";
}
}
// RSS 1.0 (RDF) を解析
function parseRSS1(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>RSSの見出しと記事内容を表示する (RSS 1.0 - RDF -)</h1>
<form method="get" name="ajaxForm" onsubmit="rssSearch();return false;">
<select id="siteURL">
<option value="http://hotwired.goo.ne.jp/news/index.rdf">Wired</option>
<option value="http://japan.cnet.com/rss/index.rdf">CNET</option>
<option value="http://www3.asahi.com/rss/index.rdf">Asahi.com</option>
<option value="http://nikkeibp.jp/jp/flash/index.rdf">日経BP</option>
<option value="http://japan.zdnet.com/rss/news/index.rdf">ZDNET</option>
</select>
<input type="button" value="検索する" onClick="rssSearch()">
</form>
<div id="result"></div>
</div>
</body>
</html>
同様の方法で他の要素（日時など）も読み出して処理することができます。
次項ではRSS 2.0を読み込んでみます。
[
第11章 3:RSS 2.0を読み込むへ]
[
目次へ]
(2006.1.29)