JavaScript获取XML数据附示例截图

由于我无法直接提供截图，但我可以给你一个JavaScript中获取XML数据的基本示例代码。这个示例将展示如何使用`XMLHttpRequest`（在较老的浏览器中）或`fetch` API（在现代浏览器中）来获取并解析XML数据。

### 使用`fetch` API获取XML（推荐现代浏览器）

// 假设我们有一个XML文件的URL
const url = 'example.xml';

fetch(url)
  .then(response => {
    if (!response.ok) {
        throw new Error('Network response was not ok');
    }
    return response.text(); // 或者使用response.blob()根据需求
  })
  .then(str => {
    // 这里我们简单地将XML字符串转换为DOM对象
    // 注意：在浏览器环境中，可以使用DOMParser
    const parser = new DOMParser();
    const xmlDoc = parser.parseFromString(str, "text/xml");

    // 现在你可以通过DOM API来访问XML数据了
    console.log(xmlDoc.getElementsByTagName('root')[0]); // 假设你的XML根元素是<root>
  })
  .catch(error => {
    console.error('There was a problem with your fetch operation:', error);
  });

### 使用`XMLHttpRequest`获取XML（旧浏览器）

var xhr = new XMLHttpRequest();
xhr.open("GET", "example.xml", true);
xhr.onreadystatechange = function() {
    if (xhr.readyState == 4 && xhr.status == 200) {
        // 请求成功，处理数据
        var xmlDoc = xhr.responseXML; // 直接得到XML DOM对象

        // 现在你可以通过DOM API来访问XML数据了
        console.log(xmlDoc.getElementsByTagName('root')[0]); // 假设你的XML根元素是<root>
    }
};
xhr.send();

请注意，这些示例假设你正在从同一域或已正确配置CORS（跨源资源共享）策略的域请求XML文件。如果你的XML数据来源于不同的域，并且该域没有正确配置CORS，那么浏览器将阻止这些请求。

此外，由于我无法直接提供截图，上述代码段应该能满足你获取并处理XML数据的基本需求。