XML ontleden met JavaScript

Ik moet XML kunnen ontleden met JavaScript. De XML bevindt zich in een variabele. Ik zou liever geen jQuery of andere frameworks gebruiken.

Ik heb dit bekeken, XML > jQuery lezen.


Antwoord 1, autoriteit 100%

Ik gok op basis van je laatste vraag, 20 minuten ervoor gesteld , dat u de XML probeert te ontleden (lezen en converteren) die is gevonden met behulp van GeoNames’ FindNearestAddress.

Als uw XML zich in een stringvariabele bevindt met de naam txten er als volgt uitziet:

<address>
  <street>Roble Ave</street>
  <mtfcc>S1400</mtfcc>
  <streetNumber>649</streetNumber>
  <lat>37.45127</lat>
  <lng>-122.18032</lng>
  <distance>0.04</distance>
  <postalcode>94025</postalcode>
  <placename>Menlo Park</placename>
  <adminCode2>081</adminCode2>
  <adminName2>San Mateo</adminName2>
  <adminCode1>CA</adminCode1>
  <adminName1>California</adminName1>
  <countryCode>US</countryCode>
</address>

Vervolgens kun je de XML ontleden met Javascript DOM als volgt:

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

En verkrijg specifieke waarden van de knooppunten als volgt:

//Gets house address number
xmlDoc.getElementsByTagName("streetNumber")[0].childNodes[0].nodeValue;
//Gets Street name
xmlDoc.getElementsByTagName("street")[0].childNodes[0].nodeValue;
//Gets Postal Code
xmlDoc.getElementsByTagName("postalcode")[0].childNodes[0].nodeValue;

JSFiddle


feb. Bewerken 2019:

Als reactie op de zorgen van @gaugeinvariante over XML met Namespace-prefixen.
Mocht u xml moeten ontleden met Namespace-prefixen, dan zou alles bijna identiek moeten werken:

OPMERKING: dit werkt alleen in browsers die xml-naamruimtevoorvoegsels ondersteunen, zoals Microsoft Edge

// XML with namespace prefixes 's', 'sn', and 'p' in a variable called txt
txt = `
<address xmlns:p='example.com/postal' xmlns:s='example.com/street' xmlns:sn='example.com/streetNum'>
  <s:street>Roble Ave</s:street>
  <sn:streetNumber>649</sn:streetNumber>
  <p:postalcode>94025</p:postalcode>
</address>`;
//Everything else the same
if (window.DOMParser)
{
    parser = new DOMParser();
    xmlDoc = parser.parseFromString(txt, "text/xml");
}
else // Internet Explorer
{
    xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
    xmlDoc.async = false;
    xmlDoc.loadXML(txt);
}
//The prefix should not be included when you request the xml namespace
//Gets "streetNumber" (note there is no prefix of "sn"
console.log(xmlDoc.getElementsByTagName("streetNumber")[0].childNodes[0].nodeValue);
//Gets Street name
console.log(xmlDoc.getElementsByTagName("street")[0].childNodes[0].nodeValue);
//Gets Postal Code
console.log(xmlDoc.getElementsByTagName("postalcode")[0].childNodes[0].nodeValue);

Antwoord 2, autoriteit 8%

Het volgende zal een XML-tekenreeks ontleden in een XML-document in alle belangrijke browsers, inclusief Internet Explorer 6. Als u dat eenmaal hebt, kunt u de gebruikelijke DOM-traversal-methoden/-eigenschappen zoals childNodes en getElementsByTagName() gebruiken om de knooppunten te krijgen je wilt.

var parseXml;
if (typeof window.DOMParser != "undefined") {
    parseXml = function(xmlStr) {
        return ( new window.DOMParser() ).parseFromString(xmlStr, "text/xml");
    };
} else if (typeof window.ActiveXObject != "undefined" &&
       new window.ActiveXObject("Microsoft.XMLDOM")) {
    parseXml = function(xmlStr) {
        var xmlDoc = new window.ActiveXObject("Microsoft.XMLDOM");
        xmlDoc.async = "false";
        xmlDoc.loadXML(xmlStr);
        return xmlDoc;
    };
} else {
    throw new Error("No XML parser found");
}

Voorbeeld van gebruik:

var xml = parseXml("<foo>Stuff</foo>");
alert(xml.documentElement.nodeName);

Die ik heb gekregen van https://stackoverflow.com/a/8412989/1232175.

Other episodes