PHP 和 AJAX RSS 閱讀器
RSS 閱讀器用于閱讀 RSS Feed。
RSS 允許對新聞和更新進行快速瀏覽。
AJAX RSS 閱讀器
在下面的 AJAX 實例中,我們將演示一個 RSS 閱讀器,通過它,來自 RSS 的內容在不進行刷新的情況下載入網(wǎng)頁。
在下面的列表框中選擇一個 RSS 新聞訂閱
在此列出 RSS Feed。
本例包括三個元素:
- 簡單的 HTML 表單
- JavaScript
- PHP 頁面
HTML 表單
這是 HTML 頁面。它包含一個簡單的 HTML 表單和執(zhí)行一個 JavaScript 文件的鏈接:
<html> <head> <script type="text/javascript" src="getrss.js"></script> </head> <body> <form> Select an RSS-Feed: <select onchange="showRSS(this.value)"> <option value="Google">Google News</option> <option value="MSNBC">MSNBC News</option> </select> </form> <p><div id="rssOutput"> <b>RSS Feed will be listed here.</b></div></p> </body> </html>
例子解釋 - HTML 表單
正如您看到的,上面的 HTML 頁面包含一個簡單的 HTML 表單,其中帶有一個下拉列表框。
表單是這樣工作的:
- 當用戶選擇下拉框中的選項時,會觸發(fā)一個事件
- 當事件觸發(fā)時,執(zhí)行 showRSS() 函數(shù)
表單下面是名為 "rssOutput" 的一個 <div>。它用作 showRSS() 函數(shù)所返回的數(shù)據(jù)的占位符。
JavaScript
JavaScript 代碼存儲在 "getrss.js" 中,它與 HTML 文檔相連接:
var xmlHttp function showRSS(str) { xmlHttp=GetXmlHttpObject() if (xmlHttp==null) { alert ("Browser does not support HTTP Request") return } var url="getrss.php" url=url+"?q="+str url=url+"&sid="+Math.random() xmlHttp.onreadystatechange=stateChanged xmlHttp.open("GET",url,true) xmlHttp.send(null) } function stateChanged() { if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") { document.getElementById("rssOutput") .innerHTML=xmlHttp.responseText } } function GetXmlHttpObject() { var xmlHttp=null; try { // Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest(); } catch (e) { // Internet Explorer try { xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } } return xmlHttp; }
例子解釋:
stateChanged() 和 GetXmlHttpObject 函數(shù)與 PHP 和 AJAX 請求 這一節(jié)中的例子相同。
showRSS() 函數(shù)
每當在下拉框中選擇選擇時,該函數(shù)就會執(zhí)行:
- 定義發(fā)送到服務器的 url (文件名)
- 把參數(shù) (q) 添加到 url,參數(shù)內容是下拉框中的被選項
- 添加一個隨機數(shù),以防止服務器緩存文件
- 調用 GetXmlHttpObject 函數(shù)來創(chuàng)建 XMLHTTP 對象,并告知該對象在觸發(fā)一個改變時去執(zhí)行 stateChanged 函數(shù)
- 通過給定的 url 來打開 XMLHTTP
- 把 HTTP 請求發(fā)動到服務器
PHP 頁面
調用 JavaScript 代碼的服務器頁面是名為 "getrss.php" 的 PHP 文件:
<?php //get the q parameter from URL $q=$_GET["q"]; //find out which feed was selected if($q=="Google") { $xml=("http://news.google.com/news?ned=us&topic=h&output=rss"); } elseif($q=="MSNBC") { $xml=("http://rss.msnbc.msn.com/id/3032091/device/rss/rss.xml"); } $xmlDoc = new DOMDocument(); $xmlDoc->load($xml); //get elements from "<channel>" $channel=$xmlDoc->getElementsByTagName('channel')->item(0); $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; //output elements from "<channel>" echo("<p><a href='" . $channel_link . "'>" . $channel_title . "</a>"); echo("<br />"); echo($channel_desc . "</p>"); //get and output "<item>" elements $x=$xmlDoc->getElementsByTagName('item'); for ($i=0; $i<=2; $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>"); } ?>
例子解釋:
當一個選項從 JavaScript 發(fā)送時,會發(fā)生:
- PHP 找出哪個 RSS feed 被選中
- 為選中的 RSS feed 創(chuàng)建 XML DOM 對象
- 找到并輸出來自 RSS 頻道的元素
- 遍歷前三個 RSS 項目中的元素,并進行輸出