How to parse XML string value using jQuery?

Question

Hi All,

I am new to jquery. I am trying to parse xml string using jquery. I have found one sample:

$(function () {
    $.get('data.xml', function (d) {
        var data = "";
        var startTag = "<table border='1' id='mainTable'><tbody><tr><td style=\"width: 120px\">Name</td><td style=\"width: 120px\">Link</td></tr>";
        var endTag = "</tbody></table>";
        $(d).find('url').each(function () {
            var $url = $(this);
            var link = $url.find('link').text();
            var name = $url.find('name').text();
            data += '<tr><td>' + name + '</td>';
            data += '<td>' + link + '</td></tr>';
        });
        $("#content").html(startTag + data + endTag);
    });
});

In this case, I am able to parse and fetch the values from xml file, but now what I am looking for is instead of reading file from a URL, I want to read the xml from string. Say, instead of data.xml I want to parse string which consists of well formed xml.

Does anyone have any idea about this ?

Thanks in advance

Edit : I tried a sample code on following xml;

<?xml version="1.0" encoding="utf-8" ?>
<Urls>
    <url>
        <name>google</name>
        <link>www.google.com</link>
    </url>
    <url>
        <name>aspdotnetcodebook</name>
        <link>http://aspdotnetcodebook.blogspot.com&lt;/link&gt;
    </url>
</Urls>

When I try this on xml file, everything works fine. But when I switched to string, it returns nothing for link attribute. I am calling it as;

$(function() {
            var data = $('<?xml version="1.0" encoding="utf-8" ?><Urls><url><name>google</name><link>www.google.com</link></url><url><name>aspdotnetcodebook</name><link>http://aspdotnetcodebook.blogspot.com&lt;/link&gt;&lt;/url&gt;&lt;/Urls&gt;');
            alert(data);
            doWhateverItIsYourDoing(data);
           });

I am unable to diagnose why this is happening.

Answer 1

Just pass the string directly?

function doWhateverItIsYoureDoing(xml) {
    var data = "";
    var startTag = "<table border='1' id='mainTable'><tbody><tr><td style=\"width: 120px\">Name</td><td style=\"width: 120px\">Link</td></tr>";
    var endTag = "</tbody></table>";
    $(xml).find('url').each(function() {
        var $url = $(this);
        var link = $url.find('link').text();
        var name = $url.find('name').text();
        data += '<tr><td>' + name + '</td>';
          data += '<td>' + link + '</td></tr>';
     });
    $("#content").html(startTag + data + endTag);
}

your .get could be rewritten as:

 $.get('data.xml',doWhateverItIsYoureDoing );

and if you have xml in a string already, then

 var data = "<?xml version=\"1......";
 doWhateverItIsYoureDoing(data);

Answer 2

Just put that well-formed XML string into a jQuery object:

var xml = "<?xml version=\"1.0\"?><Dialog><Adam Emotion=\"strong\">I love you!</Adam><Eva Emotion=\"low\">I love you, too!</Eva></Dialog>";

access with

alert($(xml).find('Adam').text());

or

alert($(xml).find('Adam').attr('Emotion'));