PHP Example - AJAX RSS Reader

RSS Reader is used to read RSS Feed.

AJAX RSS Reader

In the following example, we will demonstrate an RSS reader through which the content from RSS is not refreshed on the web page. The following is loaded:

QQ图片20161010104158.png

Example explanation-HTML page

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

<html>
<head>
<meta charset="utf-8">
<title>php中文网</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 will perform the following steps:

##· off

· The function created at the server response when it is ready

· Send a request to the file on the server

. Contents of the drop-down list)

PHP file

File rss_demo.xml.

The server page called through JavaScript in the above paragraph 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 request for the RSS feed is sent from JavaScript to the PHP file, what will happen is:

· off out off out off out out out out out out out through out through use use through through through through through through through through through through through through through throughthroughthroughthroughdownthroughdownunderdowndown‐‐‐‐ whip‐‐‐‐‐‐‐whip whiwhi whi whi behalf . Extract and output the element

from the element Extract and output the element

from the item element

Continuing Learning

new file

<html> <head> <meta charset="utf-8"> <title>php中文网</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>

submit Reset Code

Automatic operation

PHP Example - AJAX RSS Reader

ElementaryImperial CMS enterprise imitation website tutorial

ElementaryNewbies with zero foundation in WordPress build personal blogs and corporate websites

ElementaryUltimate CMS zero-based website building instruction video

ElementaryFront-end project-Shangyou [HTML/CSS/JS technology comprehensive practice]

IntermediateVue3.0 from 0 to build a universal backend management system project practice

ElementaryZero-based front-end course [Vue advanced learning and practical application]

ElementaryWEB front-end tutorial [HTML5+CSS3+JS]

ElementaryQuick introduction to apipost

IntermediateVue3+TypeScript practical tutorial-enterprise-level project practice

ElementaryLet's briefly talk about starting a business in PHP

IntermediateVUE e-commerce project (front-end & back-end dual project actual combat)

ElementaryApipost practical application [api, interface, automated testing, mock]