Javascript Schleife durch XML von REST

Question

Wie kann ich verschiedene untergeordnete Tags der oberen Tags mit Javascript durchlaufen und drucken Sie den Tag-Namen und den Wert in HTML. Ein kurzes Beispiel

<Product> 
    <Books> 
     <Genere> 
     <Sport> 
      <Name>Book A</Name> 
      <Name>Book B</Name> 
      <Name>Book C</Name> 
      </Sport> 
     <Genere> 
     <History> 
      <Name>Book A</Name> 
      <Name>Book B</Name> 
      <Name>Book C</Name> 
     </History> 
     </Genere> 
    </Books> 
    <Product> 

Sagt sie, ich mag die 6 Buchnamen in folgenden Weise drucken:

Name: Buch A Name: Buch B Name: Buch C

Name: Buch A Name: Buch B Name: Buch C

Ich schaute auf W3C Beispiele, aber sie waren nicht wirklich hilfreich.

Answer 1

Zuerst müssen Sie die XML-Zeichenfolge in ein XMLDOM-Objekt analysieren. Dann können Sie die verschiedenen Methoden und Eigenschaften dieses Objekts verwenden, um durch die Knoten zu navigieren und die gewünschten Daten zu erhalten. Ich habe unten ein Beispiel hinzugefügt. Beachten Sie, dass in Ihren Daten ein schließendes Tag fehlte (der erste Knoten <Genere>).

//Function to parse XML string into an xml dom object 
 
var parseXML = function(text){ 
 
    var xmlDoc; 
 
    if (window.DOMParser){ 
 
     var parser = new DOMParser(); 
 
     xmlDoc = parser.parseFromString(text, "text/xml"); 
 
    } else { 
 
     // Internet Explorer 
 
     xmlDoc = new ActiveXObject("Microsoft.XMLDOM"); 
 
     xmlDoc.async = false; 
 
     xmlDoc.loadXML(text); 
 
    } 
 
    return xmlDoc; 
 
} 
 
//Function to get child nodes by name 
 
var getChildrenByName = function(node, name){ 
 
    var childNodes = node.childNodes, matchingNodes = []; 
 
    for(var i=0; i<childNodes.length; ++i){ 
 
    if(childNodes[i].nodeType !== Node.TEXT_NODE && childNodes[i].tagName == name){ 
 
     matchingNodes.push(childNodes[i]); 
 
    } 
 
    } 
 
    return matchingNodes; 
 
} 
 

 
//Test data 
 
var data = '<Product><Books><Genere><Sport><Name>Book A</Name><Name>Book B</Name><Name>Book C</Name></Sport></Genere><Genere><History><Name>Book A</Name><Name>Book B</Name><Name>Book C</Name></History></Genere></Books><Product>' 
 

 
//Execute parse 
 
var doc = parseXML(data); 
 

 
//Get Product node 
 
var product = doc.firstChild; 
 

 
//Get Books node 
 
var books = getChildrenByName(product, 'Books')[0]; 
 

 
//Get genres 
 
var genres = getChildrenByName(books, 'Genere'); 
 

 
//Loop through genres 
 
var str = ''; 
 
for(var i=0; i<genres.length; ++i){ 
 
    var genre = genres[i].firstChild; 
 
    str += '<h2>'+genre.tagName+'</h2>'; 
 
    //Get book names 
 
    var bookNames = getChildrenByName(genre, 'Name'); 
 
    //Loop book names 
 
    for(var j=0; j<bookNames.length; ++j){ 
 
    str += bookNames[j].textContent + '<br>'; 
 
    } 
 
} 
 

 
document.body.innerHTML = str;