XML/javascript parsing nodes - specify child by name

Question

for XML string that contains Sales Orders and Details with SKU and Qty...

var myOrders = 
"<?xml version='1.0' encoding='UTF-8'?>" +
"<Orders>" +
   "<Order>" +
      "<OrderHeader>" +
          "<OrderNo>12345</OrderNo>" +
      "</OrderHeader>" +
      "<OrderDetails>" +      
         "<Sku>ABC</Sku>" +
         "<Qty>2</Qty>" +
         "<Sku>DEF</Sku>" +
         "<Qty>3</Qty>" +
      "</OrderDetails>" +
   "</Order>"....
"</Orders>";

I can parse with javascript in Mozill alike this..

parser=new DOMParser();
xmlDoc=parser.parseFromString(myOrders,"text/xml");    
myValue = xmlDoc.getElementsByTagName("Order");

// list all all SKUs ordered
for(i = 0; i < myValue.length; i++){    
    console.log(myValue);
    var order = myValue[i].firstChild.firstChild.firstChild.nodeValue;
    document.write(order + "<br>");
}

Can I replace this line:

    var order = myValue[i].firstChild.firstChild.firstChild.nodeValue;

with something more specific

something like...

  var order = myValue[i]['Order']['OrderDetail']['Sku'].nodeValue;

Answer 1

You can try querySelector :

myValue[i].querySelector('OrderHeader > OrderNo').textContent

Also consider querySelectorAll :

var elements = xmlDoc.querySelectorAll("Order > OrderHeader > OrderNo");
for(var i = 0; i < elements.length; i++){    
    var order = elements[i].textContent;
}

Answer 2

Using querySelector and querySelectorAll, this seem to work. Can I get any more efficient? I don't seem to have to use complete path ( A > B > C). Note that I added OrderDetail tags to example below. I validates without this, but just seems cleaner.

var myOrders = 
"<?xml version='1.0' encoding='UTF-8'?>" +
"<Orders>" +
   "<Order>" +
      "<OrderHeader>" +
          "<OrderNo>12345</OrderNo>" +
      "</OrderHeader>" +
      "<OrderDetails>" +      
         "<OrderDetail>" +    
            "<Sku>ABC</Sku>" +
            "<Qty>2</Qty>" +
         "</OrderDetail>" +   
         "<OrderDetail>" +    
            "<Sku>DEF</Sku>" +
            "<Qty>4</Qty>" +
         "</OrderDetail>" +   
      "</OrderDetails>" +
   "</Order>"...;

document.write("</br>4. Get all Orders Numbers and SKU Ordered for each Order</br>");
myOrders= xmlDoc.getElementsByTagName("Order"); 
// iterate through orders
for(x = 0; x < myOrders.length; x++){           
    var myOrder = myOrders[x].querySelector('OrderNo').textContent;
    document.write(myOrder + "</br>");

// iterate through SKUS in each order
    var mySkus = myOrders[x].querySelectorAll('OrderDetail > Sku');     
    for(y = 0; y < mySkus.length; y++){                     
        document.write("-- SKU: " + mySkus[y].firstChild.nodeValue + "</br>");
    }
}
document.write("<hr>");