Solved

Need to parse sitemap.xml file using Javascript, and to display as html

Posted on 2011-09-21
8
538 Views
Last Modified: 2012-05-12
I have the following sitemap XML file:

http://docksidemarket.3dcartstores.com/sitemap.xml

I need to find a way to parse this XML file using javascript, and to display it as HTML.

Is this possible to achieve?  If so, how?  

Ideally, I'd like to do it in such a way that I don't need to add any javascript code to the HEAD section of the page (and instead have all of the javascript code be contained somewhere within the opening and closing BODY tags).

Please advise.

Thanks!
- Yvan
0
Comment
Question by:egoselfaxis
8 Comments
 
LVL 6

Expert Comment

by:bartvd
ID: 36576330
Yes, it is possible.
This is how you parse xml via javascript: http://www.w3schools.com/xml/xml_parser.asp

Here is an example:
http://www.w3schools.com/xml/tryit.asp?filename=tryxml_parsertest
0
 
LVL 82

Expert Comment

by:leakim971
ID: 36576454
> to display it as HTML

could you provide an example for example for the first one :
<url>
<loc>http://docksidemarket.3dcartstores.com/</loc>
<lastmod>2011-09-21</lastmod>
<changefreq>daily</changefreq>
<priority>1</priority>
</url>

Open in new window


are you ok with the follwing :
<tr><td>http://docksidemarket.3dcartstores.com</td><td>2011-09-21</td><td>daily</td></tr>

Open in new window

0
 
LVL 20

Expert Comment

by:Proculopsis
ID: 36580073

Use a style sheet to automatically transform your xml, as below:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head>
<title>http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_27320729.html</title>
<script type="text/javascript" src="http://filedb.experts-exchange.com/incoming/2011/05_w20/458595/jquery-1.5.2.min.js"></script>
<script type="text/javascript">

jQuery(document).ready( function() {

  var xmlSource = $("#xml-source").val();
  var xslSource = $("#xml-style-sheet").val();

  var xml = parser( xmlSource );
  var xsl = parser( xslSource );
  var transform = xml.transformNode( xsl );
  $("#transform").html( transform );

});

function parser( xml )
{
  var result = new ActiveXObject( "MSXML.DOMDocument" );
  result.async = false;
  result.loadXML( xml );
  return result;
}

</script>

</head> 
<body> 

<div id="transform" class="main"></div>

<fieldset style="padding: 16px; width: 60%"><legend>XSL</legend>
<textarea id="xml-style-sheet" style="width: 100%; height: 200px; background-color: beige;">

<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:template match="/">
  <ul>
      <xsl:for-each select="urlset/url">
        <li>
          <a href="{loc}"><xsl:value-of select="loc" /></a>
        </li>
      </xsl:for-each>
  </ul>
</xsl:template>
</xsl:stylesheet>

</textarea>
</fieldset>

<fieldset style="padding: 16px; width: 60%"><legend>XML</legend>
<textarea id="xml-source" style="width: 100%; height: 200px; background-color: beige;">

<?xml version="1.0" encoding="ISO-8859-1"?>
<urlset><url><loc>http://docksidemarket.3dcartstores.com/</loc><lastmod>2011-09-21</lastmod><changefreq>daily</changefreq><priority>1</priority></url><url><loc>http://docksidemarket.3dcartstores.com/Cakes_c_1.html</loc><lastmod>2011-09-21</lastmod><changefreq>weekly</changefreq><priority>0.8</priority></url><url><loc>http://docksidemarket.3dcartstores.com/Cookies-Brownies_c_7.html</loc><lastmod>2011-09-21</lastmod><changefreq>weekly</changefreq><priority>0.8</priority></url><url><loc>http://docksidemarket.3dcartstores.com/Island-Assortments_c_8.html</loc><lastmod>2011-09-21</lastmod><changefreq>weekly</changefreq><priority>0.8</priority></url><url><loc>http://docksidemarket.3dcartstores.com/Salsa_c_9.html</loc><lastmod>2011-09-21</lastmod><changefreq>weekly</changefreq><priority>0.8</priority></url><url><loc>http://docksidemarket.3dcartstores.com/Sauces_c_10.html</loc><lastmod>2011-09-21</lastmod><changefreq>weekly</changefreq><priority>0.8</priority></url><url><loc>http://docksidemarket.3dcartstores.com/Hot-Sauces_c_11.html</loc><lastmod>2011-09-21</lastmod><changefreq>weekly</changefreq><priority>0.8</priority></url><url><loc>http://docksidemarket.3dcartstores.com/Reel-Heat_c_12.html</loc><lastmod>2011-09-21</lastmod><changefreq>weekly</changefreq><priority>0.8</priority></url><url><loc>http://docksidemarket.3dcartstores.com/Gift-Shop_c_13.html</loc><lastmod>2011-09-21</lastmod><changefreq>weekly</changefreq><priority>0.8</priority></url><url><loc>http://docksidemarket.3dcartstores.com/Conch-Chowder_p_9.html</loc><lastmod>2011-09-21</lastmod><changefreq>monthly</changefreq><priority>0.5</priority></url><url><loc>http://docksidemarket.3dcartstores.com/Island-Jerk-Meatloaf_p_10.html</loc><lastmod>2011-09-21</lastmod><changefreq>monthly</changefreq><priority>0.5</priority></url><url><loc>http://docksidemarket.3dcartstores.com/Jicama-and-Corn-Fruit-Salad_p_11.html</loc><lastmod>2011-09-21</lastmod><changefreq>monthly</changefreq><priority>0.5</priority></url><url><loc>http://docksidemarket.3dcartstores.com/Tomatillo-and-Swiss-Cheese-Enchiladas_p_12.html</loc><lastmod>2011-09-21</lastmod><changefreq>monthly</changefreq><priority>0.5</priority></url><url><loc>http://docksidemarket.3dcartstores.com/Key-Lime-Cheesecake_p_13.html</loc><lastmod>2011-09-21</lastmod><changefreq>monthly</changefreq><priority>0.5</priority></url><url><loc>http://docksidemarket.3dcartstores.com/Seafood-Bisque_p_14.html</loc><lastmod>2011-09-21</lastmod><changefreq>monthly</changefreq><priority>0.5</priority></url><url><loc>http://docksidemarket.3dcartstores.com/About-Us_ep_7.html</loc><lastmod>2011-09-21</lastmod><changefreq>monthly</changefreq><priority>0.3</priority></url><url><loc>http://docksidemarket.3dcartstores.com/In-Your-Neighborhood_ep_40.html</loc><lastmod>2011-09-21</lastmod><changefreq>monthly</changefreq><priority>0.3</priority></url><url><loc>http://docksidemarket.3dcartstores.com/Serving-Suggestions_ep_42.html</loc><lastmod>2011-09-21</lastmod><changefreq>monthly</changefreq><priority>0.3</priority></url><url><loc>http://docksidemarket.3dcartstores.com/Storage_ep_43.html</loc><lastmod>2011-09-21</lastmod><changefreq>monthly</changefreq><priority>0.3</priority></url><url><loc>http://docksidemarket.3dcartstores.com/Wholesale_ep_45.html</loc><lastmod>2011-09-21</lastmod><changefreq>monthly</changefreq><priority>0.3</priority></url></urlset>
</textarea>
</fieldset>

</body>
</html>

Open in new window

0
 

Author Comment

by:egoselfaxis
ID: 36580389
leakim971 - yes -- I am ok with the table rows/cells.  All I need from the xml file are the urls, really.

Thanks,
- Yvan

0
3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

 
LVL 82

Expert Comment

by:leakim971
ID: 36580576
the XML is hosted on a different website than your page?
0
 

Author Comment

by:egoselfaxis
ID: 36580620
No it is not - it is on the same site.

- Yvan
0
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 36580962
Ok put this in the body where you want to see the url :
<div id="urls"></div>
<script type="text/javascript" language="javascript">

	var xmlhttp;
	if(window.XMLHttpRequest) xmlhttp = new XMLHttpRequest();else xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
	xmlhttp.onreadystatechange = function() {
		if(xmlhttp.readyState==4 && xmlhttp.status==200) {

	    	loc = xmlhttp.responseXML.documentElement.getElementsByTagName("loc");
	    	for(i=0;i<loc.length;i++) {
		    	document.getElementById("urls").appendChild(document.createTextNode( loc[i].firstChild.nodeValue ));
		    	document.getElementById("urls").appendChild(document.createElement("br"));
	    	}
	    	document.getElementById("urls").innerHTML = table;
	    }	    
	}
	xmlhttp.open("GET", "sitemap.xml", true);
	xmlhttp.send(null);

</script>

Open in new window

0
 

Author Closing Comment

by:egoselfaxis
ID: 36582445
That worked for me - thanks!

- Yvan
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …

920 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now