J*aScript如何通过AJAX请求获取并处理XML数据_J*aScript通过AJAX获取处理XML数据

新闻中心 NEWS CENTER

您当前位置：首页 > 新闻中心 > 网络学院

JaScript如何通过AJAX请求获取并处理XML数据_JaScript通过AJAX获取处理XML数据

2025-11-09

浏览次数：次

返回列表

J*aScript可通过XMLHttpRequest或fetch API获取并解析XML数据，首先创建请求对象，发送GET请求，成功后利用responseXML或DOMParser将响应转为XML DOM，再通过DOM方法提取内容。

javascript如何通过ajax请求获取并处理xml数据_javascript通过ajax获取处理xml数据

J*aScript可以通过AJAX请求获取并处理XML数据，主要利用XMLHttpRequest对象或现代的fetch API来发送请求，并解析返回的XML格式响应。虽然如今JSON更常用，但在一些老系统或特定场景中，XML仍是数据传输的格式之一。

使用XMLHttpRequest获取XML数据

这是传统但依然有效的方法，适用于不支持fetch的旧浏览器。

基本步骤如下：

创建XMLHttpRequest实例
配置GET请求并指定XML文件或接口地址
设置onload事件处理响应
检查状态码是否成功（如200）
通过responseXML属性获取解析后的XML DOM对象
使用DOM方法遍历和提取数据

const xhr = new XMLHttpRequest();
xhr.open('GET', 'data.xml', true);
xhr.onload = function() {
  if (xhr.status === 200) {
    const xmlDoc = xhr.responseXML;
    const items = xmlDoc.getElementsByTagName('item');
    for (let i = 0; i < items.length; i++) {
      const title = items[i].getElementsByTagName('title')[0].textContent;
      console.log(title);
    }
  } else {
    console.error('请求失败:', xhr.status);
  }
};
xhr.send();

使用fetch API获取并解析XML

fetch是现代J*aScript推荐的方式，语法更简洁，结合Promise使用更灵活。

Yaara

使用AI生成一流的文案广告，电子邮件，网站，列表，博客，故事和更多…

95 查看详情 Yaara

由于fetch默认不会自动解析XML，需要手动将响应文本转换为XML DOM。

使用fetch发起请求
调用response.text()获取原始文本
使用DOMParser将字符串解析为XML文档
操作XML DOM提取所需信息

fetch('data.xml')
  .then(response => response.text())
  .then(str => {
    const parser = new DOMParser();
    const xmlDoc = parser.parseFromString(str, 'text/xml');
    const titles = xmlDoc.querySelectorAll('item title');
    titles.forEach(title => {
      console.log(title.textContent);
    });
  })
  .catch(err => {
    console.error('请求或解析失败:', err);
  });