AJAX RSS阅读器代码实例|ajax showRSS()函数应用-WEB开发网
您的位置:网站主页> Ajax教程 > AJAX RSS阅读器代码实例|ajax showRSS()函数应用

AJAX RSS阅读器代码实例|ajax showRSS()函数应用

时间:2015-03-27 09:26:56   编辑:一切随缘   文章来源:php教程网 已阅读:2719 次

        AJAX RSS阅读器代码实例|ajax showRSS()函数应用。

        RSS 阅读器用于阅读 RSS Feed。 RSS 允许对新闻和更新进行快速浏览。

        AJAX RSS 阅读器
        在下面的 AJAX 实例中,我们将演示一个 RSS 阅读器,通过它,来自 RSS 的内容在不进行刷新的情况下载入网页。
        在下面的列表框中选择一个 RSS 新闻订阅
        Select an RSS-Feed:  Google News MSNBC News

        在此列出 RSS Feed。

        本例包括三个元素:

        简单的 HTML 表单

        JavaScript
        PHP 页面
        HTML 表单
        这是 HTML 页面。它包含一个简单的 HTML 表单和执行一个 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 表单,其中带有一个下拉列表框。

        表单是这样工作的:

        当用户选择下拉框中的选项时,会触发一个事件
        当事件触发时,执行 showRSS() 函数
        表单下面是名为 "rssOutput" 的一个 <div>。它用作 showRSS() 函数所返回的数据的占位符。
        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 函数与 PHP 和 AJAX 请求 这一节中的例子相同。


        showRSS() 函数
        每当在下拉框中选择选择时,该函数就会执行:

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

        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 发送时,会发生:


        PHP 找出哪个 RSS feed 被选中
        为选中的 RSS feed 创建 XML DOM 对象
        找到并输出来自 RSS 频道的元素
        遍历前三个 RSS 项目中的元素,并进行输出
 

本文地址:http://www.php186.com/content/article/ajax/24578.html(转载请保留)

相关关键词搜索:AJAX RSS阅读器代码实例,ajax showRSS()函数应用

查看评论更多>>
4楼 liujian 2015-04-21 17:34发表
好网站,值得收藏,以后会多多来看,很多文章内容都挺好的!
3楼 niulang 2015-04-21 17:33发表
不论国外,单是我们中国,各种各样的网站数不胜数。打开页面第一个看到的不是你的网站有什么,而是你的整体布局,一个清爽、干净、整洁的页面是一个赢得人心的法宝,大站有大站的气势,小站有小站的风格,好的视觉效果可以告诉人们这个站点有实力,这个站点值得信赖,给人很强的亲和力,有一种发现新宝地,希望赶紧收藏的冲动。
2楼 leenons 2015-04-21 17:28发表
现在看php学习网都会在百度上面找找看评分怎么样,值不值得一看;同时也会将看过的php教程网站记录,有时候留下一些自己的感想的评论,有很多逗比的评论,还有很多专业的评论,建议大家可以在web开发网上面寻找相关文章、api,大部分的内容都还合理。
1楼 xiaobudian 2015-04-21 17:25发表
网站文章挺不错的,值得学习,希望站长多多努力!
发表评论
      
* 以上用户言论只代表其个人观点,不代表www.php186.com网站的观点或立场
推荐文档更多

WEB开发网 | PHP教程 | Mysql教程 | Apache教程 | 最新文章 | PHP面试题| 网站地图 | Google地图 | Baidu地图 | 在线WEB论坛| 中纪委反腐最新消息

WEB技术QQ交流群:151888886 站长Q号:547218888
版权所有者:WEB开发网 地址:云南省文山州砚山县盘龙乡 滇ICP备12002707号-1
特别声明:本站内容仅供参考,不作为设计及确切依据!想了解更多,可立即进入Bbs提问