如何使用 DOM 解析器解析 JavaScript 中的 XML 資料？

使用 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中文網其他相關文章！