PHP complete se...LOGIN
PHP complete self-study manual
author:php.cn  update time:2022-04-15 13:53:54

AJAX RSS Reader



RSS Reader is used to read RSS feeds.


AJAX RSS Reader

In the following example, we will demonstrate an RSS reader through which content from RSS is loaded without refreshing the web page. Enter:


RSS-feed data list...

Example explanation - HTML page

When the user selects a certain item in the drop-down list above RSS-feed, a function named "showRSS()" will be executed. This function is triggered by the "onchange" event:

<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<script>
function showRSS(str)
{
         if (str.length==0)
          { 
                   document.getElementById("rssOutput").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)
                   {
                          document.getElementById("rssOutput").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>

showRSS() function performs the following steps:

  • Check Whether an RSS-feed is selected

  • Create an XMLHttpRequest object

  • Create a function that executes when the server response is ready

  • Send a request to a file on the server

  • Please note the parameter (q) added to the end of the URL (contains the contents of the drop-down list)


PHP file

File rss_demo.xml.

The server page called through JavaScript above is a PHP file named "getrss.php":

<?php
// rss 文件
$xml="rss_demo.xml";
$xmlDoc = new DOMDocument();
$xmlDoc->load($xml);
// 从 "<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;
// 输出 "<channel>" 中的元素
echo("<p><a href='" . $channel_link
  . "'>" . $channel_title . "</a>");
echo("<br>");
echo($channel_desc . "</p>");
// 输出 "<item>" 中的元素
$x=$xmlDoc->getElementsByTagName('item');
for ($i=0; $i<=1; $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>");
}
?>

When the RSS feed When a request is sent from JavaScript to a PHP file, what happens is:

  • Check which RSS feed is selected

  • Create a new XML DOM object

  • Load RSS documents in xml variables

  • Extract and output elements from channel elements

  • Extract and output elements from item elements

## Recommended related video tutorials: "AJAX Tutorial"http://www. php.cn/course/list/25.html