I participated in the first AJAX competition some time ago, but the result was a few minutes different from that in the first round ~~~
One of the questions is to use AJAX technology to read RSS seeds. It is very enlightening to learn about AJAX technology. Now I have published my own implementation code for you to learn and exchange!
Question:
Use XMLHttpRequest to read the RSS Feed (http://ajaxcn.org/exec/rss) of ajaxcn.org and use the HTML list tag (UL/OL/LI) to list the obtained Blog entries.
Code implementation:
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Strict // EN"
Http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd>
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Title> RSS Reader </title>
<! -- Copyright Turkeycock -->
<Script type = "text/javascript">
Var xmlHttp;
Function createXMLHttpRequest (){
If (window. ActiveXObject ){
XmlHttp = new ActiveXObject ("Microsoft. XMLHTTP ");
}
Else if (window. XMLHttpRequest ){
XmlHttp = new XMLHttpRequest ();
}
}
Function readRSS (){
CreateXMLHttpRequest ();
XmlHttp. onreadystatechange = handleStateChange;
XmlHttp. open ("GET", "http://ajaxcn.org/exec/rss", true );
XmlHttp. send (null );
}
Function handleStateChange (){
If (xmlHttp. readyState = 4 ){
If (xmlHttp. status = 200 ){
Clearpreviusresults ();
ParseResults ();
}
}
}
Function clearpreviusresults (){
Var ListBody = document. getElementById ("resultsTitle ");
While (ListBody. childNodes. length> 0 ){
ListBody. removeChild (ListBody. childNodes [0]);
}
}
Function parseResults (){
Var results = xmlHttp. responseXML;
Var title = null;
Var item = null;
Var items = results. getElementsByTagName ("item ");
For (var I = 0; I <items. length; I ++ ){
Item = items [I];
Title = item. getElementsByTagName ("title") [0]. firstChild. nodeValue;
AddListRow (title );
}
}
Function addListRow (title ){
Var row = document. createElement ("ul ");
Var cell = createCellWithText (title );
Row. appendChild (cell );
Document. getElementById ("resultsTitle"). appendChild (row );
}
Function createCellWithText (text ){
Var cell = document. createElement ("li ");
Var textNode = document. createTextNode (text );
Cell. appendChild (textNode );
Return cell;
}
</Script>
</Head>
<Body>
<H2> Blog article list <Form action = "#">
<Input type = "button" value = "Search" onclick = "readRSS ();"/>
</Form>
<Div id = "resultsTitle"> </div>
</Body>
</Html>
You can run the task after deploying it to a web Container. I am running it in Tomcat 5.5 and can read the RSS seeds correctly!