Javascript Ajax asynchronous reading RSS document implementation

RSS is an xml-based file standard, and content sharing between websites can be easily realized through XML files conforming to the RSS specification. Ajax is short for Asynchronous JavaScript and XML. With Ajax, you can make a request to a server over the hypertext transfer protocol (Http) and continue processing additional data while waiting for that response. Ajax technology makes it easy to read remote XML files, so you can use Ajax technology to remotely access summary information generated according to the RSS standard, or even write your own RSS reader.

              Ajax is not a new language or technology; it is really a combination of several technologies in a certain way. Working together to play their respective roles in the collaboration, including: standardizing rendering using XHTML and CSS; DOM is used for dynamic display and interaction. Data exchange and processing using XML and XSLT; Asynchronous data reading using XMLHttpRequest; Finally, bind and process all the data in JavaScript. Well, I won't say much about the theory, but let's go straight to the code.

              Create the XMLHttpRequest object and send the request to the server:

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);
 }

Through DOM operation, the Rss document is traversed to obtain the required value:

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; 
    } 
}

Call the createXHR(url) function, pass in the parameter, and send a request to the server:

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

Response:

function getResponse(){ 
   if(xmlHttp.readyState == 4){      
        if(xmlHttp.status == 200){  
            rssDoc = xmlHttp.responseXML; 
            readDoc(rssDoc);//Call the readDoc() function
        }else{ 
            document.getElementById("rssTitle").innerHTML = " Read exception! "; 
            //alert(xmlHttp.status); 
        } 
    } 
}