首頁 >web前端 >js教程 >Javascript Ajax非同步讀取RSS文檔具體實作_javascript技巧

Javascript Ajax非同步讀取RSS文檔具體實作_javascript技巧

WBOY
WBOY原創
2016-05-16 17:09:331082瀏覽

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){         xmlHttp = new XMLHttpRequest();
     }else{ 

    xmlHttp.open("post", url,"false");
    xmlHttp.onreadystatechange = getResponse;     xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlenm.setRequestHeader("Content-type", "application/x-www-form-urlencode"); 🎜> }



透過DOM操作對Rss文件進行遍歷,得到需要的值:

複製程式碼

程式碼如下:function readDoc(doc){ .getElementsByTagName("channel")[0];
    docTitle = root.getElementsByTagName("title")[0];
    docLink = root.getElementsByTagName(🎜>    docLink = root.getElementsByTagName("link")[0]; root.getElementsByTagName("description")[0];
    items = root.getElementsByTagName("item");
    items[i].getElementsByTagName("title")[0];
        itemLink = items[i].getElementsByTagName("link")[0];
   )[0];
        //itemPubDate = items[i].getElementsByTagName("pubDate")[0];
     > temp = "

" itemTitle.firstChild.nodeValue "

" "

" itemDescription.firstChild.nodeValue "


";
        document.getElementById("readRss").style.display = "none" 🎜> "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){     
        rssDoc = xmlHttp.responseXML;
            readDoc (rssDoc);//調用readDoc()函數
        }else{
            @@;"rsTisTitle>").nerHT制定   //alert(xmlHttp.status);
        }
    }
}


陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn