如何使用 DOM 解析器解析 JavaScript 中的 XML 数据？-js教程-PHP中文网

如何使用 DOM 解析器解析 JavaScript 中的 XML 数据？

Patricia Arquette

发布： 2024-12-05 11:59:15

原创

690 人浏览过

How to Parse XML Data in JavaScript Using the DOM Parser?

使用 JavaScript 解析 XML

使用 JavaScript 解析 XML 涉及将 XML 数据转换为更易于管理的格式进行处理。要在没有外部框架的情况下解析 XML，我们可以利用大多数现代浏览器中提供的文档对象模型 (DOM)。

考虑存储在字符串变量中的以下 XML：

<address>
  <street>Roble Ave</street>
  <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>

登录后复制

解析这个 XML 使用 DOM，我们可以按照以下步骤操作：

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

登录后复制

解析 XML 后，我们可以从节点：

// Gets house address number
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);

登录后复制

此外，如果XML包含命名空间前缀，则请求命名空间时不应包含前缀：

// XML with Namespace prefixes
txt = `

  Roble Ave
  649
  94025
`;

// Parse with Namespace prefixes
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 "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);

登录后复制

以上是如何使用 DOM 解析器解析 JavaScript 中的 XML 数据？的详细内容。更多信息请关注PHP中文网其他相关文章！