Pembaca RSS AJAX dan PHP

Pembaca RSS digunakan untuk membaca Feed RSS.

RSS memungkinkan untuk menggulir berita dan pembaruan dengan cepat.

Pembaca RSS AJAX

Dalam contoh AJAX di bawah ini, kita akan menunjukkan penelengkap RSS, melalui yang berikut konten RSS diimpor ke halaman web tanpa memperbaharui halaman.

Pilih berita berlangganan RSS di daftar di bawah ini

Pilih Feed RSS:

Daftar Feed RSS disini.

Contoh ini termasuk tiga elemen:

  • Formulir HTML sederhana
  • JavaScript
  • PHP 页面

Formulir HTML

Ini adalah halaman HTML. Ia mengandung formulir HTML sederhana dan tautan ke berkas JavaScript:

<html>
<head>
<script type="text/javascript" src="getrss.js"></script>
</head>
<body>
<form> 
Pilih Feed RSS:
<select onchange="showRSS(this.value)">
<option value="Google">Berita Google</option>
<option value="MSNBC">Berita MSNBC</option>
</select>
</form>
<p><div id="rssOutput">
<b>Berita Feed RSS akan disiarkan di sini.</b></div></p>
</body>
</html>

Pengertian contoh - Formulir HTML

Seperti yang anda lihat, halaman HTML atas mengandung formulir HTML sederhana yang mengandung kotak pilihan

Bagaimana formulir bekerja:

  1. Ketika pengguna memilih opsi di dropdown, peristiwa akan dijalankan
  2. Ketika peristiwa dijalankan, fungsi showRSS() akan dijalankan

Bawah formulir adalah satu <div> yang dinamakan "rssOutput". Ia digunakan sebagai penempatan data yang dikembalikan oleh fungsi showRSS().

JavaScript

Kod JavaScript disimpan di "getrss.js", ia disambungkan dengan dokumen HTML:

var xmlHttp
function showRSS(str)
 { 
 xmlHttp=GetXmlHttpObject()
 if (xmlHttp==null)
  {
  alert ("Browser tidak mendukung permintaan HTTP")
  kembalikan
  }
 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");
  }
 }
kembalikan xmlHttp;
}

Contoh penjelasan:

stateChanged() dan fungsi GetXmlHttpObject dengan Permintaan AJAX dan PHP 本节中的例子相同。

showRSS() 函数

每当在下拉框中选择选择时，该函数就会执行：

  1. 定义发送到服务器的 url （文件名）
  2. 将参数 (q) 添加到 url，参数内容是下拉框中的被选项
  3. 添加一个随机数，以防止服务器缓存文件
  4. 调用 GetXmlHttpObject 函数创建 XMLHTTP 对象，并告知该对象在触发一个改变时去执行 stateChanged 函数
  5. 通过给定的 url 打开 XMLHTTP
  6. 向服务器发送 HTTP 请求

PHP 页面

服务名为 "getrss.php" 的 JavaScript 调用的服务器页面是 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>");
 }
?>

Contoh penjelasan:

Berlaku apabila pilihan dihantar daripada JavaScript:

  1. PHP cari feed RSS yang dipilih
  2. Buat objek XML DOM untuk feed RSS pilihan
  3. Cari dan keluarkan elemen daripada kanal RSS
  4. Lengkapkan elemen RSS yang pertama, kedua dan ketiga, dan keluarkan