您的位置：首页 > Web前端 > JQuery

JQUERY+AJAX 做一个超级简单的RSS阅读器

2009-07-12 15:16 549 查看

1，我用的是 JS/jquery-1[1].3.1.js

2, 满足添加是 RSS2.0

3, 下面是所有代码用了三个层，第一个显示状态，第二个显示主要标题第三个显示二级标题

<html>
<head runat="server" >
<title>RSS</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style type="text/css">
#Text1
{
width: 605px;
}
#Button1
{
width: 69px;
}
</style>
<script language="javascript" type="text/javascript" src="JS/jquery-1[1].3.1.js" ></script>

<script language="javascript" type="text/javascript">
// <!CDATA[

$(document).ready(function()
{
$("#Button1").bind("click",function(event)
{
$.get($("#Text1").attr("value"));
})
$("#divResult").ajaxComplete(function(evt, request, settings)
{
$("#title").text($(request.responseXML).find("title").eq(0).text());
$(request.responseXML).find("item").each(function(i,n)
{
$("<div></div>")
.attr("style","border: thin solid #00FF00")
.html('<a href='+$(n).find("link").text() +' target=_blank>'+$(n).find("title").text()+'</a>')
.appendTo("#divResult");
});

})

$("#divStatus").ajaxComplete(function(evt, request, settings)
{
$("#divStatus").append('<div>ajaxComplete</div>');
})

$("#divStatus").ajaxError(function(evt, request, settings)
{
$("#divStatus").append('<div>ajaxError</div>');
})
$("#divStatus").ajaxSend(function(evt, request, settings)
{
$("#divStatus").append('<div>ajaxSend</div>');
})
$("#divStatus").ajaxStart(function()
{
$("#divStatus").append('<div>ajaxStart</div>');
})
$("#divStatus").ajaxStop(function()
{
$("#divStatus").append('<div>ajaxStop</div>');
})
$("#divStatus").ajaxSuccess(function(evt, request, settings)
{
$("#divStatus").append('<div>ajaxSuccess</div>');
})
});

// ]]>
</script>

</head>
<body>

<div style="border: thin solid #008000; height: 40px" lang="zh-cn">

网址:
<input id="Text1" title="开始" type="text" value="http://news.baidu.com/n?cmd=1&class=civilnews&tn=rss&sub=0"/><input id="Button1" title="开始" value="开始"
type="button" /><br />
<br />
</div>
<div id="divStatus" style="border:solid 1 red">
</div>
<p id="title" style="border:solid 1 red; text-align:center">

</p>
<div style="border: thin solid #008000; height: 339px;" id="divResult">

</div>

</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航