Home/ Questions/Q 6728381
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T10:09:48+00:00

This php script is able to traverse the nodes of an XML file to

  • 0

This php script is able to traverse the nodes of an XML file to show the data in an HTML table. I have been trying to do the same with a javascript but the getElementsbyTagName method hasn’t gotten me there yet. What is the problem with the javascript?

PHP script

<?php
// load SimpleXML
$nodes = new SimpleXMLElement('communities.xml', null, true);

echo <<<EOF
<table>
        <tr>
                <th>ID</th>
                <th>Name</th>
                <th>Top</th>
                <th>Left</th>
                <th>Width</th>
                <th>Height</th>
        </tr>

EOF;
foreach($nodes as $node) // loop through our books
{
        echo <<<EOF
        <tr>
                <td>{$node['ID']}</td>
                <td>{$node->NAME}</td>
                <td>{$node->TOP}</td>
                <td>{$node->LEFT}</td>
                <td>{$node->WIDTH}</td>
                <td>{$node->HEIGHT}</td>
        </tr>

EOF;
}echo '</table>';
?>

Javascript 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-

transitional.dtd">

<html lang="en-US" xml:lang="en-US" xmlns="http://www.w3.org/1999/xhtml">
<head>

<script type="text/javascript">
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.open("GET","communities.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML; 

y=xmlDoc.getElementsByTagName("COMMUNITIES")[0].childNodes;

n=y.length;

//document.write("n "+n+"<br/>");

for (i=0;i<n;i++)
{
  document.write(y[i].nodeName);
  att=y.item(i).attributes.getNamedItem("ID");
  document.write(att.value + "<br />");

  x=y.item(i).childNodes;

  name=(y[i].getElementsByTagName("NAME")[0].childNodes[0].nodeValue);
  /* top =(y[i].getElementsByTagName("TOP")[0].childNodes[0].nodeValue);
  left=(y[i].getElementsByTagName("LEFT")[0].childNodes[0].nodeValue);
  width =(y[i].getElementsByTagName("WIDTH")[0].childNodes[0].nodeValue);
  height=(y[i].getElementsByTagName("HEIGHT")[0].childNodes[0].nodeValue); */

  document.write(name+"<br/>");
  /* document.write(top+"<br/>");
  document.write(left+"<br/>");
  document.write(width+"<br/>");
  document.write(height+"<br/>");*/

}


</script>
</head>
<body>

<div id='show'></div>

</body>
</html>

The script only runs if I don’t access the node data (top, left, width, height). I commented out the lines where that data was accessed.

XML data

<?xml version="1.0" encoding="ISO-8859-1" ?> 
<COMMUNITIES>
<COMMUNITY ID="c001">
  <NAME>Town Services</NAME> 
  <TOP>50</TOP> 
  <LEFT>50</LEFT> 
  <WIDTH>200</WIDTH> 
  <HEIGHT>300</HEIGHT> 
  <URLS>
      <URL ID="U001">
          <NAME>Google.com</NAME>
          <URL>http://www.google.com</URL>
      </URL>
      <URL ID="U002">
          <NAME>Bing.com</NAME>
          <URL>http://www.bing.com</URL>
      </URL>
      <URL ID="U003">
          <NAME>Yahoo.com</NAME>
          <URL>http://www.yahoo.com</URL>
      </URL>
      <URL ID="U004">
          <NAME>Aol.com</NAME>
          <URL>http://www.aol.com</URL>
      </URL>
  </URLS> 
  </COMMUNITY>
<COMMUNITY ID="c002">
  <NAME>Local Stores</NAME> 
  <TOP>50</TOP> 
  <LEFT>260</LEFT> 
  <WIDTH>200</WIDTH> 
  <HEIGHT>150</HEIGHT> 
  <URLS>
      <URL ID="U001">
          <NAME>Walgreens</NAME>
          <URL>http://www.walgreens.com</URL>
      </URL>
      <URL ID="U002">
          <NAME>Bing.com</NAME>
          <URL>http://www.bing.com</URL>
      </URL>
      <URL ID="U003">
          <NAME>Yahoo.com</NAME>
          <URL>http://www.yahoo.com</URL>
      </URL>
  </URLS> 
  </COMMUNITY>
<COMMUNITY ID="c003">
  <NAME>Attractions</NAME> 
  <TOP>50</TOP> 
  <LEFT>470</LEFT> 
  <WIDTH>200</WIDTH> 
  <HEIGHT>300</HEIGHT> 
  <URLS>
      <URL ID="U001">
          <NAME>Museum</NAME>
          <URL>http://www.mfa.org</URL>
      </URL>
      <URL ID="U002">
          <NAME>Park</NAME>
          <URL>http://www.bing.com</URL>
      </URL>
  </URLS> 
  </COMMUNITY>
<COMMUNITY ID="c004">
  <NAME>Online Stores</NAME> 
  <TOP>370</TOP> 
  <LEFT>50</LEFT> 
  <WIDTH>200</WIDTH> 
  <HEIGHT>150</HEIGHT> 
  <URLS>
      <URL ID="U001">
          <NAME>Amazon.com</NAME>
          <URL>http://www.amazon.com</URL>
      </URL>
      <URL ID="U002">
          <NAME>Target.com</NAME>
          <URL>http://www.target.com</URL>
      </URL>
  </URLS> 
  </COMMUNITY>
<COMMUNITY ID="c005">
  <NAME>Online Forums</NAME> 
  <TOP>370</TOP> 
  <LEFT>300</LEFT> 
  <WIDTH>200</WIDTH> 
  <HEIGHT>200</HEIGHT> 
  <URLS>
      <URL ID="U001">
          <NAME>Technet</NAME>
          <URL>http://www.Microsoft.com</URL>
      </URL>
      <URL ID="U002">
          <NAME>MSDN</NAME>
          <URL>http://www.Microsoft.com</URL>
      </URL>
  </URLS> 
  </COMMUNITY>
<COMMUNITY ID="c006">
  <NAME>Travel</NAME> 
  <TOP>370</TOP> 
  <LEFT>480</LEFT> 
  <WIDTH>200</WIDTH> 
  <HEIGHT>200</HEIGHT> 
  <URLS>
      <URL ID="U001">
          <NAME>Southwest</NAME>
          <URL>http://www.mfa.org</URL>
      </URL>
      <URL ID="U002">
          <NAME>Northwest</NAME>
          <URL>http://www.bing.com</URL>
      </URL>
  </URLS> 
  </COMMUNITY>
</COMMUNITIES>

I just began looking at XML and want to understand how to traverse the nodes in both languages.

Thanks.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I gave up trying to do this with Javascript. I made all the XML file updates with PHP. That seemed the right approach anyway to update the files.

    • 0