访问xml文件节点？

Question

i have a xml file like this

<root>
    <section>
        <state>state one</state>
        <ct>
            <city>first city</city>
            <city>second city</city>
            <city>third city</city>
        </ct>
    </section>
</root>

and i want to access to city names in jquery...i have tried s.th like this:

var x;
var ct = "";
for(i=1 ; 1=3 ; i++){
x = xmlDoc.getElementsByTagName('ct')[0].childNodes[i].childNodes[0].nodeValue;
ct += x;
}
$('div').html(ct);

BUT, i only have the first city.... and i couldnt access to second and third.. a code like this:

x = xmlDoc.getElementsByTagName('ct')[0].childNodes[2].childNodes[0].nodeValue;

give me nothing!!!!!

Answer 1

Since you mentioned jQuery, you can use $.parseXML to parse the XML to an XML Document, $() to get a jQuery wrapper for that document, find to find the city nodes, and then do what you like with them (such as using map to get their text):

 var doc = $.parseXML( '<root>' + '<section>' + '<state>state one</state>' + '<ct>' + '<city>first city</city>' + '<city>second city</city>' + '<city>third city</city>' + '</ct>' + '</section>' + '</root>' ); var cities = $(doc).find("city"); var cityNames = cities.map(function() { return $(this).text(); }).get(); console.log(cityNames); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 

( get after map converts the jQuery wrapper that map returns into a plain array.)

The selector we used in find can be more specific. For instance, you specifically looked for city elements within a ct container; if that's important, our find selector should be ct > city rather than just city :

 var doc = $.parseXML( '<root>' + '<section>' + '<state>state one</state>' + '<ct>' + '<city>first city</city>' + '<city>second city</city>' + '<city>third city</city>' + '</ct>' + '</section>' + '</root>' ); var cities = $(doc).find("ct > city"); var cityNames = cities.map(function() { return $(this).text(); }).get(); console.log(cityNames); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 

Answer 2

How many childNodes do you see inside the <ct> element? Most probably 3. Actually, there are 7 childNodes in there. Three of them are your <city> elements and additional four are text nodes made of whitespaces (spaces, line breaks, carriage returns) between xml tags.

You should use functions that return array of elements rather than array of nodes (eg. getElementsByTagName).

var cities = xmlDoc.getElementsByTagName('ct')[0].getElementsByTagName('city');