js 如何解析XML数据

在javascript中解析xml数据主要有两种方法：1. 使用domparser解析xml字符串，通过new domparser()创建解析器并调用parsefromstring方法将xml字符串转换为dom文档，随后使用dom api如getelementsbytagname或getelementsbytagnamens（处理命名空间）提取数据；2. 使用xmlhttprequest获取远程xml文件，在onload事件中通过xhr.responsexml获取解析后的dom文档，并检查其有效性以确保解析成功；对于格式错误的xml，可通过检测parsererror元素判断解析是否失败；domparser适用于本地小数据量解析，性能较高，而xmlhttprequest适合从服务器异步加载xml数据，避免阻塞主线程，处理大型文件时可结合流式解析器优化内存使用。

在 JavaScript 中解析 XML 数据，主要涉及将 XML 字符串转换为可操作的 JavaScript 对象，这样你就可以方便地提取和使用 XML 数据中的信息。通常，你会使用

DOMParser

XMLHttpRequest

解决方案：

JavaScript 解析 XML 的方法主要有两种：使用

DOMParser

XMLHttpRequest

如何使用

DOMParser

解析 XML 字符串？

DOMParser

const xmlString = `
  
    
    Giada De Laurentiis
    2005
    30.00
  
  
    
    J.K. Rowling
    2005
    29.99
  
`;

const parser = new DOMParser();
const xmlDoc = parser.parseFromString(xmlString, "application/xml");

// 现在你可以使用 DOM API 来访问 XML 数据
const books = xmlDoc.getElementsByTagName("book");
for (let i = 0; i < books.length; i++) {
  const title = books[i].getElementsByTagName("title")[0].textContent;
  const author = books[i].getElementsByTagName("author")[0].textContent;
  console.log(`Title: ${title}, Author: ${author}`);
}

这里，我们首先创建了一个 XML 字符串。然后，我们实例化

DOMParser

parseFromString

"application/xml"

getElementsByTagName

如何使用

XMLHttpRequest

获取并解析 XML 数据？

如果你的 XML 数据存储在服务器上，你需要使用

XMLHttpRequest

PHP Apache和MySQL 网页开发初步

本书全面介绍PHP脚本语言和MySOL数据库这两种目前最流行的开源软件，主要包括PHP和MySQL基本概念、PHP扩展与应用库、日期和时间功能、PHP数据对象扩展、PHP的mysqli扩展、MySQL 5的存储例程、解发器和视图等。本书帮助读者学习PHP编程语言和MySQL数据库服务器的最佳实践，了解如何创建数据库驱动的动态Web应用程序。

下载

const xhr = new XMLHttpRequest();
xhr.open("GET", "books.xml", true); // 假设你的 XML 文件名为 books.xml

xhr.onload = function() {
  if (xhr.readyState === 4 && xhr.status === 200) {
    const xmlDoc = xhr.responseXML; // 获取 XML 文档对象

    // 检查是否成功解析 XML
    if (xmlDoc) {
      const books = xmlDoc.getElementsByTagName("book");
      for (let i = 0; i < books.length; i++) {
        const title = books[i].getElementsByTagName("title")[0].textContent;
        const author = books[i].getElementsByTagName("author")[0].textContent;
        console.log(`Title: ${title}, Author: ${author}`);
      }
    } else {
      console.error("Failed to parse XML.");
    }
  } else {
    console.error("Failed to load XML.");
  }
};

xhr.onerror = function() {
  console.error("Network error occurred.");
};

xhr.send();

这个例子中，我们创建了一个

XMLHttpRequest

open

onload

xhr.responseXML

responseXML

null

处理 XML 中的命名空间

XML 命名空间用于避免元素名称冲突。如果你的 XML 文档使用了命名空间，你需要使用

getElementsByTagNameNS

getElementsByTagName

const xmlStringWithNS = `
  
    My Book
  
`;

const parser = new DOMParser();
const xmlDoc = parser.parseFromString(xmlStringWithNS, "application/xml");

const books = xmlDoc.getElementsByTagNameNS("http://example.com/books", "book");
if (books.length > 0) {
  const title = books[0].getElementsByTagNameNS("http://example.com/books", "title")[0].textContent;
  console.log(`Title: ${title}`);
}

在这个例子中，我们使用了

getElementsByTagNameNS

如何处理 XML 解析错误？

XML 解析可能会因为 XML 格式不正确而失败。

DOMParser

parseError

const xmlString = `
  
    
  `; // 缺少  闭合标签

const parser = new DOMParser();
const xmlDoc = parser.parseFromString(xmlString, "application/xml");

const errorNode = xmlDoc.querySelector("parsererror");
if (errorNode) {
  console.error("XML Parsing Error:", errorNode.textContent);
} else {
  const books = xmlDoc.getElementsByTagName("book");
  // ... 正常处理 XML
}

这个例子中，我们检查了

parsererror

parsererror

性能考虑：哪种解析方法更快？

通常来说，

DOMParser

XMLHttpRequest

xml-stream