PDA

View Full Version : Viewing an XML feed from HTML


grolschie
06-28-2003, 06:40 AM
Just for a lark, I thought I'd attempt to import an XML file and view it within an HTML file. I am getting stuff to print on the screen, however the javascipt "document.write" function will only work once. It seems that if I don't reference variables from HTML below, it will complain. I downloaded the slashdot XML feed and had a go. So far it works if I put all the HTML in one "document.write" command as the second is ignored. Here is my code:

<html>
<head>
</head>
<BODY>


<script type="text/javascript" for="window" event="onload">

var xmlDoc = new ActiveXObject("Microsoft.XMLDOM")
xmlDoc.async="false"
xmlDoc.load("slashdot.xml")

nodes = xmlDoc.documentElement.childNodes

url1.innerText=xmlDoc.getElementsByTagName("url").item(0).text
title1.innerText=xmlDoc.getElementsByTagName("title").item(0).text
image1.innerText=xmlDoc.getElementsByTagName("image").item(0).text
author1.innerText=xmlDoc.getElementsByTagName("author").item(0).text
url2.innerText=xmlDoc.getElementsByTagName("url").item(1).text
title2.innerText=xmlDoc.getElementsByTagName("title").item(1).text
image2.innerText=xmlDoc.getElementsByTagName("image").item(1).text
author2.innerText=xmlDoc.getElementsByTagName("author").item(1).text
url3.innerText=xmlDoc.getElementsByTagName("url").item(2).text
title3.innerText=xmlDoc.getElementsByTagName("title").item(2).text
image3.innerText=xmlDoc.getElementsByTagName("image").item(2).text
author3.innerText=xmlDoc.getElementsByTagName("author").item(2).text

document.write("<HR><A HREF=\'" + url1.innerText + "\'>" + title1.innerText + "</A><P>Submitted by " +author1.innerText+ "</P><IMG SRC=\'http://images.slashdot.org/topics/" + image1.innerText + "\'><HR><HR><A HREF=\'" + url2.innerText + "\'>" + title2.innerText + "</A><P>Submitted by " +author2.innerText+ "</P><IMG SRC=\'http://images.slashdot.org/topics/" + image2.innerText + "\'><HR><HR><A HREF=\'" + url3.innerText + "\'>" + title3.innerText + "</A><P>Submitted by " +author3.innerText+ "</P><IMG SRC=\'http://images.slashdot.org/topics/" + image3.innerText + "\'><HR>");
</script>

<span id="url1"></SPAN>
<span id="title1"></SPAN>
<span id="image1"></SPAN>
<span id="author1"></SPAN>
<span id="url2"></SPAN>
<span id="title2"></SPAN>
<span id="image2"></SPAN>
<span id="author2"></SPAN>
<span id="url3"></SPAN>
<span id="title3"></SPAN>
<span id="image3"></SPAN>
<span id="author3"></SPAN>
</BODY>
</HTML>


I have messed around with placement of 'body' and other html tags to no avail. If I am going about this all wrong, please let me know. I used a downloaded version of the slashdot feed, as it complains if I access it too often. Here is the format:


<?xml version="1.0" ?>
- <backslash xmlns:backslash="http://slashdot.org/backslash.dtd">
- <story>
<title>2003 Amateur Radio Field Day</title>
<url>http://slashdot.org/article.pl?sid=03/06/27/1430201</url>
<time>2003-06-28 02:29:40</time>
<author>michael</author>
<department>dit-dah-dit</department>
<topic>193</topic>
<comments>44</comments>
<section>articles</section>
<image>topicwireless.gif</image>
</story>


Thanks in advance. And sorry about the width of this cut and paste.

/grol