RSS-reader in Ajax: Help with code, what's wrong/missing?
I'm learning Ajax currently, and I use "Sams Teach Yourself Ajax in 10 minutes". I've learnt much, and understand Ajax basically. The book writes code-examples and go through the code bit by bit to explain what each bit does. However. In this code there is something wrong written by the author, and I don't know what..
Here is the code:
<html>
<head>
<title>An Ajax RSS Headline Reader</title>
</head>
<script language="JavaScript" type="text/javascript">
function getXMLHTTPRequest() {
try {
req = new XMLHttpRequest(); /* e.g. Firefox */
} catch(e) {
try {
req = new ActiveXObject("Msxml2.XMLHTTP");
/* some versions IE */
} catch (e) {
try {
req = new ActiveXObject("Microsoft.XMLHTTP");
/* some versions IE */
} catch (E) {
req = false;
}
}
}
return req;
}
var http = getXMLHTTPRequest();
function getRSS() {
var myurl = 'rssproxy.php?feed=';
var myfeed = document.form1.feed.value;
myRand = parseInt(Math.random()*999999999999999);
// cache buster
var modurl = myurl+escape(myfeed)+"&rand="+myRand;
http.open("GET", modurl, true);
http.onreadystatechange = useHttpResponse;
http.send(null);
}
function useHttpResponse() {
if (http.readyState == 4) {
if(http.status == 200) {
// first remove the childnodes
// presently in the DM
while (document.getElementById('news') .hasChildNodes())
{
document.getElementById('news').removeChild(document .getElementById('news').firstChild);
}
var titleNodes = http.responseXML .getElementsByTagName("title");
var descriptionNodes = http.responseXML .getElementsByTagName("description");
var linkNodes = http.responseXML .getElementsByTagName("link");
for(var i =1;i<titleNodes.length;i++)
{
var newtext = document .createTextNode(titleNodes[i] .childNodes[0].nodeValue);
var newpara = document.createElement('p');
var para = document.getElementById('news') .appendChild(newpara);
newpara.appendChild(newtext);
newpara.className = "title";
var newtext2 = document .createTextNode(descriptionNodes[i] .childNodes[0].nodeValue);
var newpara2 = document.createElement('p');
var para2 = document .getElementById('news').appendChild(newpara2);
newpara2.appendChild(newtext2);
newpara2.className = "descrip";
var newtext3 = document .createTextNode(linkNodes[i] .childNodes[0].nodeValue);
var newpara3 = document.createElement('p');
开发者_开发知识库 var para3 = document.getElementById('news') .appendChild(newpara3);
newpara3.appendChild(newtext3);
newpara3.className = "link";
}
}
}
}
</script>
<body>
<center>
<h3>An Ajax RSS Reader</h3>
<form name="form1">
URL of RSS feed: <input type="text" name="feed" size="50" value="http://"><input
type="button" onClick="getRSS()" value="Get Feed"><br><br>
<div id="news" class="displaybox"> <h4>Feed Titles</h4></div>
</form>
</center>
</html>
and rssproxy.php looks like this:
<?php
$mysession = curl_init($_GET['feed']);
curl_setopt($mysession, CURLOPT_HEADER, false);
curl_setopt($mysession, CURLOPT_RETURNTRANSFER, true);
$out = curl_exec($mysession);
header("Content-Type: text/xml");
echo $out;
curl_close($mysession);
?>
I'd appreciate it if you could help me!
I only want to know what's wrong with this code, and not get links to other Ajax RSS-tutorials, unless it's exactly the same codes (without the malfunctions of course)..
First let's test if the php script can fetch and deliver an rss feed at all
<?php
error_reporting(E_ALL); ini_set('display_errors', 1);
// $mysession = curl_init($_GET['feed']);
$mysession = curl_init('http://www.spiegel.de/schlagzeilen/index.rss');
curl_setopt($mysession, CURLOPT_HEADER, false);
curl_setopt($mysession, CURLOPT_RETURNTRANSFER, true);
$out = curl_exec($mysession);
header("Content-Type: text/xml");
echo $out;
curl_close($mysession);
?>
Just invoke it from the browser and check the output.
If that works install and use a client-side script debugger. E.g. for firefox use Firebug. Javascript errors will show up in the console tab.
I think something wrong in XML content. Maybe missing <link> tag.
精彩评论