使用 JavaScript 解析 XML [重复]答案

【问题标题】：Parse XML using JavaScript [duplicate]使用 JavaScript 解析 XML [重复]
【发布时间】：2013-07-10 08:32:50
【问题描述】：

我需要能够使用 JavaScript 解析 XML。 XML 将在一个变量中。我宁愿不使用 jQuery 或其他框架。

我看过这个，XML > jQuery reading。

【问题讨论】：

我可能会用PhoneGap来打包应用，不知道能不能用。

标签： javascript xml domparser

【解决方案1】：

我从您的last question 猜想，在此之前 20 分钟询问您正在尝试解析（读取和转换）通过使用 GeoNames 的 FindNearestAddress 找到的 XML。

如果您的 XML 位于名为 txt 的字符串变量中，并且看起来像这样：

<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>

然后你可以像这样用 Javascript DOM 解析 XML：

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);
}

并像这样从节点获取特定值：

//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

二月。 2019 年编辑：

为了回应@gaugeinvariante 对带有命名空间前缀的 xml 的担忧。如果您需要使用命名空间前缀解析 xml，一切都应该几乎相同：

注意：这仅适用于支持 xml 命名空间前缀的浏览器，例如 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);

【讨论】：

请注意，您可以使用 jquery 快速访问值，例如 $(xmlDoc).find('street:eq(0) :eq(0)').html() 而不是 xmlDoc.getElementsByTagName("streetNumber")[0].childNodes[0].nodeValue;
查找和整合OP其他问题的答案，我称之为高级SO游戏。我印象深刻，干得好！
它适用于 >= IE6 :O
如果标签有像这样的命名空间，这在 Edge 或 IE 上不起作用
xmlDoc.getElementsByTagName("streetNumber")[0].innerHTML ...... OR ...... xmlDoc.getElementsByTagName("streetNumber")[0].textContent ??? ??????

【解决方案2】：

以下将在所有主要浏览器（包括 Internet Explorer 6）中将 XML 字符串解析为 XML 文档。一旦有了，您就可以使用通常的 DOM 遍历方法/属性，例如 childNodes 和 getElementsByTagName() 来获取节点你想要的。

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");
}

示例用法：

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

我从https://stackoverflow.com/a/8412989/1232175得到的。

【讨论】：