JQuery. Parse XML children recursively. How?_问答_开发者

I have been trying to find an example on how to go about parsing the following XML document. The sample below shows how much depth I am looking at.

I think I need the following:

1. A function to load the XML.

$.get('getProfile.xml', null, function (data) {
    // ...
}, 'xml');

2. A way to loop through root node looking for child nodes. For each child node found, loop through found child node's children looking for new children of children. If none found, just simply output what's inside this child node.

<?xml version="1.0" encoding="utf-8"?>
<GetProfile>
    <UserInfo>
        <id>free2rhyme</id>
        <name>jerry mcguire</name>
        <age>29</age>
        <sex>m</sex>
        <location>salt lake city, utah</location>
        <signup>00/00/0000</signup>
    </UserInfo>
    <Entry>
        <id>13579</id>
        <date>2011-01-24</date>
        <time>9:34:21</time>
        <title>my first jounal entry</title>
        <body>&lt;![CDATA[i'm really excited to have signed up for myjournal.co.cc! Yes!!!]]&gt;</body>
        <Comments>
            <Comment>
                <id>97531</id>
                <date>2011-02-16</date>
                <time>9:34:21</time>
                <from>otheruser84</from>
                <body>I am glad you really liked the site! Have fun!!</body>
            </Comment>
            <Comment>
                <id>97531</id>
                <date>2011-02-16</date>
                <time>9:34:21</time>
                <from>otheruser84</from>
                <body>I am glad you really liked the site! Have fun!!</body>
            </Comment>
            <Comment>
                <id>97531</id>
                <date>2011-02-16</date>
                <time>9:34:21</time>
                <from>otheruser84</from>
                <body>I am glad you really liked the site! Have fun!!</body>
           开发者_Python百科 </Comment>
        </Comments>
    </Entry>
    <Stats>
        <following>40</following>
        <followers>57</followers>
        <entries>158</entries>
        <favorites>15</favorites>
    </Stats>
    <Preview>
        <Entries>
            <Entry>
                <id>97531</id>
                <date>2011-02-16</date>
                <time>9:34:21</time>
                <title>otheruser84</title>
            </Entry>
            <Entry>
                <id>97531</id>
                <date>2011-02-16</date>
                <time>9:34:21</time>
                <title>otheruser84</title>
            </Entry>
            <Entry>
                <id>97531</id>
                <date>2011-02-16</date>
                <time>9:34:21</time>
                <title>otheruser84</title>
            </Entry>
            <Entry>
                <id>97531</id>
                <date>2011-02-16</date>
                <time>9:34:21</time>
                <title>otheruser84</title>
            </Entry>
            <Entry>
                <id>97531</id>
                <date>2011-02-16</date>
                <time>9:34:21</time>
                <title>otheruser84</title>
            </Entry>
        </Entries>
    </Preview>
</GetProfile>

3. The sample above hopefully clarifies what I am trying to do.

4. Here's a way to return the node's index, name and value however it does not check for child nodes that may also have children of their own.

var getProfile = $(data).find('GetProfile').each(function () {

    $('*', this).each(function (index, event) {
        alert('index=' + index + ' name=' + e.tagName + ' value=' + $(e).text());
    });

});

This page provides a snippet to recursively traverse an XML DOM:

function traverse(tree) {
    if (tree.hasChildNodes()) {
        document.write('<ul><li>');
        document.write('<b>' + tree.tagName + ' : </b>');
        var nodes = tree.childNodes.length;
        for (var i = 0; i < tree.childNodes.length; i++)
        traverse(tree.childNodes(i));
        document.write('</li></ul>');
    } else document.write(tree.text);
}

Another way is to use a DOM parser (e.g. window.DOMParser or ActiveXObject("Microsoft.XMLDOM")) to parse an XML string:

if (window.DOMParser) {
    parser = new DOMParser();
    xmlDoc = parser.parseFromString(text, "text/xml");
} 
else { // Internet Explorer
    xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
    xmlDoc.async = "false";
    xmlDoc.loadXML(text);
}

See this page: http://www.w3schools.com/dom/dom_parser.asp.

Edit:

function traverse(tree) {
    $(tree).contents().each(function() {
        if (this.nodeType == 3) { // text node
            // node value: $(this).text() or this.nodeValue
            console.log('text node value: '+ $(this).text());

        } else {
            console.log('tag name: ' + this.nodeName);
            traverse(this);
        }
    });
}

See this in action: http://jsfiddle.net/william/uKGHJ/1/.

you can use something like this .

$(xml).find("Entry").each(function () {  

    alert($(this).find("id").text())

    $(this).find("Comments").each(function () {
        $(this).find("Comment").each(function () {
            alert($(this).find("id").text())
            alert($(this).find("date").text())
            alert($(this).find("time").text())
        });
    });
});