JS读取XML文件 - Javascript

Javascript可以通过各种方式来读取XML文件。这里介绍两种常见的方式，一种是使用XMLHttpRequest对象来获取XML文件，另一种是使用fetch API获取XML文件。

使用XMLHttpRequest获取XML文件

步骤

1. 创建XMLHttpRequest对象

var xhr = new XMLHttpRequest();

2. 使用open方法初始化XMLHttpRequest对象，指定请求方式、URL地址以及是否异步等参数。

xhr.open("GET", "example.xml", true);

3. 设置onreadystatechange属性，指定一个回调函数，该函数在XMLHttpRequest对象的状态发生变化时触发。

xhr.onreadystatechange = function() {
  if (xhr.readyState == 4 && xhr.status == 200) {
    // do something with xhr.responseXML
  }
};

4. 发送请求

xhr.send();

示例代码

var xhr = new XMLHttpRequest();
xhr.open("GET", "example.xml", true);
xhr.onreadystatechange = function () {
  if (xhr.readyState == 4 && xhr.status == 200) {
    var xmlDoc = xhr.responseXML;
    var nameNodes = xmlDoc.getElementsByTagName("name");
    for (i = 0; i < nameNodes.length; i++) {
      console.log(nameNodes[i].childNodes[0].nodeValue);
    }
  }
};
xhr.send();

使用fetch API获取XML文件

步骤

1. 使用fetch方法获取XML文件，fetch方法返回一个Promise对象。

fetch('example.xml')

2. 使用then方法处理获取到的XML文件，将响应体解析为XML格式。

fetch('example.xml')
  .then(response => response.text())
  .then(str => (new window.DOMParser()).parseFromString(str, "text/xml"))

示例代码

fetch('example.xml')
  .then(response => response.text())
  .then(str => (new window.DOMParser()).parseFromString(str, "text/xml"))
  .then(xmlDoc => {
    var nameNodes = xmlDoc.getElementsByTagName("name");
    for (i = 0; i < nameNodes.length; i++) {
      console.log(nameNodes[i].childNodes[0].nodeValue);
    }
  });

以上就是两种常见的Javascript读取XML文件的方式。在实际开发过程中，我们可以选择最适合自己项目需求的方式来读取XML文件。