Javascript Ajax异步读取RSS文档具体实现

RSS 是一种基于 XML的文件标准，通过符合 RSS 规范的 XML文件可以简单实现网站之间的内容共享。Ajax 是Asynchronous JavaScript and XML的缩写。通过 Ajax 技术可以经由超文本传输协议(Http) 向一个服务器发出请求并且在等待该响应时继续处理另外的数据。通过 Ajax 技术可以很容易实现读取远程 XML文件，因此，可以使用 Ajax技术实现远程访问依据 RSS 标准生成的摘要信息，甚至我们可以自己写一个 RSS 阅读器。

Ajax 并不是一门新的语言或技术, 它实际上是几项技术按一定的方式组合在一起。共同在协作中发挥各自的作用, 它包括:使用XHTML 和CSS 标准化呈现; 使用DOM 实现动态显示和交互; 使用XML 和XSLT 进行数据交换与处理; 使用XMLHttpRequest进行异步数据读取; 最后用 JavaScript 绑定和处理所有数据。好了，对于理论就不在多说了，下面我们直接看代码吧。

创建XMLHttpRequest对象并将请求发送到服务器：

代码如下:

function createXHR(url){
     if(window.XMLHttpRequest){
         xmlHttp = new XMLHttpRequest();
     }else{ 
       xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlHttp.open("post",url,"false");
    xmlHttp.onreadystatechange = getResponse;     xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xmlHttp.send(null);
 }

通过DOM操作对Rss文档进行遍历，得到需要的值：

代码如下:

function readDoc(doc){
    root = doc.getElementsByTagName("channel")[0];
    docTitle = root.getElementsByTagName("title")[0];
    docLink = root.getElementsByTagName("link")[0];
    docDescription = root.getElementsByTagName("description")[0];
    items = root.getElementsByTagName("item");
    for(var i=0;i<items.length;i++){
        itemTitle = items[i].getElementsByTagName("title")[0];
        itemLink = items[i].getElementsByTagName("link")[0];
        itemDescription = items[i].getElementsByTagName("description")[0];
        //itemPubDate = items[i].getElementsByTagName("pubDate")[0];
        document.getElementById("rssTitle").innerHTML = docTitle.firstChild.nodeValue;
        temp = "</h1><h2><a href=""+itemLink.firstChild.nodeValue+"" target="_blank">"+itemTitle.firstChild.nodeValue+"</a></h2>"+"<p>"+itemDescription.firstChild.nodeValue+"</p><hr/>";
        document.getElementById("readRss").style.display = "none";
        document.getElementById("printRss").getElementsByTagName("span")[0].style.display = "none";
        document.getElementById("printRss").innerHTML = document.getElementById("printRss").innerHTML + temp;
    }
}

调用createXHR(url)函数，传入参数，向服务器发送求:

代码如下:

createXHR("http://www.apple.com.cn/hotnews/rss/hotnews.rss");

得到响应:

代码如下:

function getResponse(){
   if(xmlHttp.readyState == 4){     
        if(xmlHttp.status == 200){ 
            rssDoc = xmlHttp.responseXML;
            readDoc(rssDoc);//调用readDoc()函数
        }else{
            document.getElementById("rssTitle").innerHTML = "读取异常！";
            //alert(xmlHttp.status);
        }
    }
}

赞 (0)

相关推荐

  • javascript ajax的5种状态介绍

    在<Pragmatic ajax(动态网站静态化) A Web 2.0 Primer >中偶然看到对readyStae状态的介绍,感觉这个介绍很实在,摘译如下: 0: (Uninitialized) the send( ) method has not yet been invoked. 1: (Loading) the send( ) method has been invoked, request in progress. 2: (Loaded) the send( ) method ha

  • JavaScript基于Ajax实现不刷新在网页上动态显示文件内容

    本文实例讲述了JavaScript基于Ajax实现不刷新在网页上动态显示文件内容的方法.分享给大家供大家参考.具体如下: 下面的JS代码是一个最基础的JS的ajax实现,可以动态显示服务器上的文件ajax_info.txt文件的内容 <!DOCTYPE html> <html> <head> <title>sharejs.com</title> <script> function loadXMLDoc() { var xmlhttp;

  • JavaScript调用ajax获取文本文件内容实现代码

    JavaScript调用ajax获取文本文件内容实现代码

    这几年JQuery写多了,传统的的javascript已经很久不写了,不少东西都忘掉了,还有多少人记得javascript中实现ajax操作需要借助XMLHttpRequest对象,其实jquery的ajax本质也是这个,好了,今天就花点时间演示一下如何用传统javascript获取文本内容并展示在页面上,废话不多少,直接上代码,注释写的很详细,大家应该能看懂: 复制代码 代码如下: <script type="text/javascript"> //(A)①获取文本文件方

  • JavaScript AJAX之惰性载入函数

    在JS中有些内存只需执行一遍即可,如浏览器类型检测是最常用的一个功能,因为我们使用Ajax的时候需要检测浏览器的内置的XHR.我们可以在第一次检测的时候记录下类型,往后在使用Ajax的时候就不需要再去检测浏览器类型了.在JS中就算只有一个if也总比没有if的语句效率要高. 普通Ajax方法 复制代码 代码如下: /**  * JS惰性函数  */   function ajax(){     if(typeof XMLHttpRequest != "undefined"){      

  • javascript结合ajax读取txt文件内容

    代码很简洁,这里就不多废话了,直接上源码 html代码 复制代码 代码如下: <!doctype html>  <html>   <head>       <meta charset="utf-8"/>       </head>       <body>           <button type="button"  onclick="show()">请求数据

  • JavaScript实现Ajax总结

    ajax应用非常普及,ajax的优点大家都知道,具体就不多说了,其缺点还真不少,比如破坏浏览器的back功能,同一个url打开的界面并不是完全相同,还有安全性能等方面,至于有这么多的缺点,也阻止不了大家使用ajax的步伐~~~ 这里以表单为例说一下实现Ajax的步骤: 1.先从表单中获取我们需要的数据 2.然后建立相应的URL 3.设置onreadystatechange函数 4.打开连接 5.发送请求 以上就是Ajax的实现步骤,接下来简单分步总结下. 首先是关于xrh对象的建立. funct

  • 原生Javascript封装的一个AJAX函数分享

    最近的工作中涉及到大量的ajax操作,本来该后台做的事也要我来做了.而现在使用的ajax函数是一个后台人员封装的--但他又是基于jquery的ajax,所以离开了jquery这个函数就毫无作用了.而且我觉得,jquery的ajax方法是很完善的了,可以直接用,如果都有jquery了,那么他的ajax就不用白不用了.我缺少的是一个能在没有jquery的情况下使用的ajax方法. 所以我也花一天时间写了一个,参数与调用方法类似于jquery的ajax.就叫xhr吧,因为xhr=XMLHttpRequ

  • Javascript Ajax异步读取RSS文档具体实现

    RSS 是一种基于 XML的文件标准,通过符合 RSS 规范的 XML文件可以简单实现网站之间的内容共享.Ajax 是Asynchronous JavaScript and XML的缩写.通过 Ajax 技术可以经由超文本传输协议(Http) 向一个服务器发出请求并且在等待该响应时继续处理另外的数据.通过 Ajax 技术可以很容易实现读取远程 XML文件,因此,可以使用 Ajax技术实现远程访问依据 RSS 标准生成的摘要信息,甚至我们可以自己写一个 RSS 阅读器. Ajax 并不是一门新的语

  • php ajax异步读取rss文档数据

    RSS(Really Simple Syndication)是一种描述和同步网站内容的格式,是使用最广泛的XML应用.RSS搭建了信息迅速传播的一个技术平台,使得每个人都成为潜在的信息提供者. 本文实例为大家分享了php ajax异步读取rss文档数据的相关代码,供大家参考,具体内容如下 代码如下: index.html <html> <head> <script> function showRSS(str) { if (str.length==0) { documen

  • ajax异步读取后台传递回的下拉选项的值方法

    jsp中html相关代码 <tr> <td class="tdcell_word2">请选择展会:</td> <td class="tdcell_word3" colspan="3"> <select name="select" id="jieci" onchange="getChange()"> <option valu

  • php通过baihui网API实现读取word文档并展示

    项目中遇到一个小问题,想实现php 如何读取word文档,并将其内容原样显示 可以 使用API 可以看看baihui.com 的写写应用 的API 申请一个 APPKEY 就能使用,你可以看看 ... 对免费版本有限制 比如 excel 支持,可以参考我这个 appkey是我申请的,可以使用吧 ... 保存成本地的一个html文件 打开后直接使用 word 的类似 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN&q

  • Java获取XML节点总结之读取XML文档节点的方法

    Java获取XML节点总结之读取XML文档节点的方法

    dom4j是Java的XML API,用来读写XML文件的.目前有很多场景中使用dom4j来读写xml的. 要使用dom4j开发,需要下载导入dom4j相应的jar文件. 官网下载:http://www.dom4j.org/dom4j-1.6.1/ github下载:http://dom4j.github.io/ 下载解压之后如图所示: 我们只需要把dom4j-1.6.1.jar文件构建到我们开发项目中就可以了. 下面就以Eclipse创建java项目的构建方法为例说明: 声明:本Java项目的

  • PHP读取word文档的方法分析【基于COM组件】

    本文实例讲述了PHP读取word文档的方法.分享给大家供大家参考,具体如下: php开发 过程中可能会word文档的读取问题,这里可以利用com组件来完成此项操作 一.先开启php.ini的COM,操作如下 1. extension=php_com_dotnet.dll 2. com.allow_dcom = true 二.开启之后就可以试下如下操作 1.建立一个指向新COM组件的索引 $word = new COM("word.application") or die("C

  • PHP使用DOM和simplexml读取xml文档的方法示例

    本文实例讲述了PHP使用DOM和simplexml读取xml文档的方法.分享给大家供大家参考,具体如下: 实例  用DOM获取下列xml文档中所有金庸小说的书名,该xml文档所在位置为 ./books.xml: <?xml version="1.0" encoding="utf-8"?> <root> <book> <title>天龙八部</title> <author>金庸</autho

  • php删除txt文件指定行及按行读取txt文档数据的方法

    本文实例讲述了php删除txt文件指定行及按行读取txt文档数据的方法.分享给大家供大家参考,具体如下: 向txt文件循环写入值: $keys = range(1,999); $file = fopen('key_11010000.txt',"w"); foreach($keys as $key){ fwrite($file,"$key\r\n"); } fclose($file); $f1 = fopen('key_11010000.txt','r'); whil

  • python读取word文档的方法

    本文实例讲述了python读取word文档的方法.分享给大家供大家参考.具体如下: 首先下载安装win32com from win32com import client as wc word = wc.Dispatch('Word.Application') doc = word.Documents.Open('c:/test') doc.SaveAs('c:/test.text', 2) doc.Close() word.Quit() 这种方式产生的text文档,不能用python用普通的r方

  • Java使用poi包读取Excel文档代码分享

    项目需要解析Excel文档获取数据,就在网上找了一些资料,结合自己这次使用,写下心得: 1.maven项目需加入如下依赖: <dependency> <groupId>org.apache.poi</groupId> <artifactId>poi</artifactId> <version>3.10-FINAL</version> </dependency> <dependency> <gr

随机推荐