终于到AJAX,AJAX翻译过来就是”异步Javascript和XML”,他可以实现网页内容的部分加载,可提高用户体验。现在有很多网站都有用这技术,反正你知道他能实现网页的异步更新就差不多了。当然下面的例子都相对简单,并没有体现它这一特点~
阅读器
新建文件【 AJAX RSS 阅读器.html】
<html>
<head>
<title>AJAX RSS 阅读器 </title>
<script type="text/javascript">
function showRss(str) {
var out = document.getElementById("rssOutput");
if (str.length == 0) {
out.innerHTML = "";
return;
}
if (window.XMLHttpRequest) {
// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行
xmlhttp = new XMLHttpRequest();
} else {
// IE6, IE5 浏览器执行
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
out.innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","getrss.php?q=" + str, true);
xmlhttp.send();
}
</script>
</head>
<body>
<form>
<select onchange="showRss(this.value)">
<option value="">选择一个 RSS-feed:</option>
<option value="rss">读取RSS的数据</option>
</select>
</form>
<br>
<div id="rssOutput">RSS-feed 数据列表...</div>
</body>
</html>
新建文件【 getrss.php】内容如下:
<?php
// 加载xml文件
$xmlDoc = new DOMDocument();
$xmlDoc -> load("rss_demo.xml");
// 读取channel节点中的元素
$channel = $xmlDoc -> getElementsByTagName('channel') -> item(0);
// 逐个读取channel节点下的子节点
$channel_title = $channel -> getElementsByTagName('title') -> item(0) -> childNodes -> item(0) -> nodeValue;
$channel_link = $channel -> getElementsByTagName('link') -> item(0) -> childNodes -> item(0) -> nodeValue;
$channel_desc = $channel -> getElementsByTagName('description') -> item(0) -> childNodes -> item(0) -> nodeValue;
echo "<p><a href='" . $channel_link . "'>" . $channel_title . "</a>";
echo("<br>");
echo($channel_desc . "</p>");
$x = $xmlDoc -> getElementsByTagName("item");
// 输出 "<item>" 中的元素
for ($i = 0; $i < $x -> length; $i++) {
$item_title = $x -> item($i) -> getElementsByTagName('title') -> item(0) -> childNodes -> item(0) -> nodeValue;
$item_link = $x -> item($i) -> getElementsByTagName('link') -> item(0) -> childNodes -> item(0) -> nodeValue;
$item_desc = $x -> item($i) -> getElementsByTagName('description') -> item(0) -> childNodes -> item(0) -> nodeValue;
echo "<p><a href='" . $item_link . "'>" . $item_title . "</a>";
echo("<br>");
echo($item_desc . "</p>");
}
?>
新建一个xml的文档 【rss_demo.xml】供读取的文档
<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0">
<channel>
<title>菜鸟教程</title>
<link>http://www.runoob.com</link>
<description>学的不仅技术,更新梦想!!!</description>
<item>
<title>RSS 教程</title>
<link>http://www.runoob.com/rss/rss-tutorial.html</link>
<description>通过使用 RSS,您可以有选择地浏览您感兴趣的以及与您的工作相关的新闻。</description>
</item>
<item>
<title>XML 教程</title>
<link>http://www.runoob.com/xml/xml-tutorial.html</link>
<description>XML 指可扩展标记语言(eXtensible Markup Language)。</description>
</item>
</channel>
此时目录:
|-AJAX RSS 阅读器.html
|-getrss.php
|-rss_demo.xml
如果不同则需修改上面相应的代码
内容仅供参考~