电脑爱好者,提供IT资讯信息及各类编程知识文章介绍,欢迎大家来本站学习电脑知识。 最近更新 | 联系我们 RSS订阅本站最新文章
电脑爱好者
站内搜索: 
当前位置:首页>> AJAX技术>>用Ajax读取RSS种子的简单例子:

用Ajax读取RSS种子的简单例子

来源:www.cncfan.com | 2006-4-27 | (有2675人读过)

前段时间参加了第一届AJAX大赛,结果差了几分,第一轮都没过,郁闷中~~~

其中一题是用AJAX 技术读取RSS种子,感觉对学习AJAX技术很有启发意义,现在把本人的实现代码公布,以供大家学习交流!

题目:
使用XMLHttpRequest读取ajaxcn.org的RSS Feed(http://ajaxcn.org/exec/rss),并用HTML的列表标签(UL/OL/LI)列出获取的的Blog条目.

代码实现:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>RSS Reader</title>
<!--copyright Turkeycock-->
<script type="text/javascript">
var xmlHttp;

function createXMLHttpRequest() {
if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
}

function readRSS() {
createXMLHttpRequest();
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.open("GET", "http://ajaxcn.org/exec/rss", true);
xmlHttp.send(null);
}

function handleStateChange() {
if(xmlHttp.readyState == 4) {
if(xmlHttp.status == 200) {
clearPreviousResults();
parseResults();
}
}
}

function clearPreviousResults() {
var ListBody = document.getElementById("resultsTitle");
while(ListBody.childNodes.length > 0) {
ListBody.removeChild(ListBody.childNodes[0]);
}
}

function parseResults() {
var results = xmlHttp.responseXML;
var title = null;
var item = null;

var items = results.getElementsByTagName("item");
for(var i = 0; i < items.length; i++) {
item = items[i];
title = item.getElementsByTagName("title")[0].firstChild.nodeValue;

addListRow(title);
}

}


function addListRow(title) {
var row = document.createElement("ul");
var cell = createCellWithText(title);
row.appendChild(cell);

document.getElementById("resultsTitle").appendChild(row);
}

function createCellWithText(text) {
var cell = document.createElement("li");
var textNode = document.createTextNode(text);
cell.appendChild(textNode);

return cell;
}
</script>
</head>

<body>
<h2>Blog文章列表</h2>
<form action="#">
<input type="button" value="搜索" onclick="readRSS();"/>
</form>
<div id="resultsTitle"></div>
</body>
</html>

部署到web容器中就可以运行,我是在Tomcat 5.5中运行的,可以正确读取RSS种子!


上一篇一小时的快乐
下一篇AJAX基础教程
AJAX技术热门文章排行
网站赞助商
购买此位置

 

关于我们 | 网站地图 | 文档一览 | 友情链接| 联系我们

Copyright © 2003-2020 电脑爱好者 版权所有 备案号:鲁ICP备09059398号