使用javascript或jquery将XML解析为字符串

Question

I need to parse a XML into a string based on user's search input using Javascript or Jquery.

XML is located at rssfeed.ucoz.com/rssfeed.xml Too large to place here.

Example:

Original XML

<item>
    <title>Abyssal Warder fire</title>
    <guid isPermaLink="false">//lh5.googleusercontent.com/_qvhVKLFln2A/TU-51_bGZ9I/AAAAAAAAEW4/uAmzL3e-vn0/Abyssal%20Warder%20fire.jpg</guid>
    <media:description>Giant Destroyer</media:description> 
    <media:thumbnail url="http://lh5.googleusercontent.com/_qvhVKLFln2A/TU-51_bGZ9I/AAAAAAAAEW4/uAmzL3e-vn0/s144/Abyssal%20Warder%20fire.jpg" />
    <media:group>
        <media:content url="http://lh5.googleusercontent.com/_qvhVKLFln2A/TU-51_bGZ9I/AAAAAAAAEW4/uAmzL3e-vn0/Abyssal%20Warder%20fire.jpg" />
        <media:content isDefault="true" width="685" height="295" url="http://rssfeed.ucoz.com/Battleforge.html" type="text/html" /> 
    </media:group> 
</item>

<item>
    <title>Abyssal Warder frost</title>
    <guid isPermaLink="false">//lh4.googleusercontent.com/_qvhVKLFln2A/TU-54ZuHv6I/AAAAAAAAEW8/gtPs25XUjhY/Abyssal%20Warder%20frost.jpg</guid>
    <media:description>Giant Destroyer</media:description> 
    <media:thumbnail url="http://lh4.googleusercontent.com/_qvhVKLFln2A/TU-54ZuHv6I/AAAAAAAAEW8/gtPs25XUjhY/s144/Abyssal%20Warder%20frost.jpg" />
    <media:group>
            <media:content url="http://lh4.googleusercontent.com/_qvhVKLFln2A/TU-54ZuHv6I/AAAAAAAAEW8/gtPs25XUjhY/Abyssal%20Warder%20frost.jpg" />
            <media:content isDefault="true" width="685" height="295" url="http://rssfeed.ucoz.com/Battleforge.html" type="text/html" /> 
    </media:group> 
</item>

Outcome as string when user search for "Abyssal Warder Fire" or just "Abyssal Fire"

<item>
    <title>Abyssal Warder fire</title>
    <guid isPermaLink="false">//lh5.googleusercontent.com/_qvhVKLFln2A/TU-51_bGZ9I/AAAAAAAAEW4/uAmzL3e-vn0/Abyssal%20Warder%20fire.jpg</guid>
    <media:description>Giant Destroyer</media:description> 
    <media:thumbnail url="http://lh5.googleusercontent.com/_qvhVKLFln2A/TU-51_bGZ9I/AAAAAAAAEW4/uAmzL3e-vn0/s144/Abyssal%20Warder%20fire.jpg" />
    <media:group>
        <media:content url="http://lh5.googleusercontent.com/_qvhVKLFln2A/TU-51_bGZ9I/AAAAAAAAEW4/uAmzL3e-vn0/Abyssal%20Warder%20fire.jpg" />
        <media:content isDefault="true" width="685" height="295" url="http://rssfeed.ucoz.com/Battleforge.html" type="text/html" /> 
    </media:group> 
</item>

I've been searching for 5 days in the net, and I couldn't get anything. All the results I see are parsed xml that are shown as HTML, but none as string. I need it as string because I will feed the string it into a web application's api that requires it as a string. Please help, any ideas or code on how to accomplish this would be greatly appreciated. Thanks in advance.

Answer 1

If I understand your question correctly, sounds like all you need is to load that XML via XMLHttpRequest and then use XPath query to locate what you're looking for.

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","http://rssfeed.ucoz.com/rssfeed.xml ",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML; 

Answer 2

EDIT: i forget to metion that I'm using JQuery

Here is my point of view:

function init(){
   $.ajax({
      type: "GET",
      url: "http://localhost/gis/hola.xml",    // this should be your XML url
      dataType: "text",
      success: parseXml    // your own callback function
   });
}

function parseXml(xml){
   xml = xml.replace(/\n/g,'');       // just to replace carry return
   var url = 'http://localhost/'+xml;
   alert(url);
}

Your xml file is:

<?xml version="1.0" encoding="utf-8" ?>
<RecentTutorials>
  <Tutorial author="The Reddest">
    <Title>Silverlight and the Netflix API</Title>
  </Tutorial>
</RecentTutorials>

Then, your url variable should be (remember to convert '/' symbol to its specific ASCII character before sends it (http://www.asciitable.com/)):

http://localhost/<?xml version="1.0" encoding="utf-8" ?><RecentTutorials><Tutorial author="The Reddest"><Title>Silverlight and the Netflix API</Title></Tutorial></RecentTutorials>

url now have this value. If you try to show this var on a div :

Silverlight and the Netflix API

Because your browser doesn't skip < and > symbols.

Try to call your function like this:

function parseXml(xml){
   xml = xml.replace(/\n/g,'');       // just to replace carry return
   cooliris.embed.setFeedContents('XML parsed as string: '+xml) 
}

I hope it helps you. Happy codding!