fetch加载XML首选text()+DOMParser，需同源或CORS，响应头Content-Type须为application/xml/text/xml，解析失败查parsererror，命名空间用getElementsByTagNameNS，IE11降级XMLHttpRequest。
用 fetch 加载 XML 文件最直接
现代浏览器中，fetch 是首选方式，它原生支持 Response.text() 和 Response.xml（部分浏览器已支持），但更稳妥的是用 text() + DOMParser 解析。注意：XML 文件必须同源或服务端配置了 CORS，否则会触发跨域错误 TypeError: Failed to fetch。
常见错误是直接把 fetch(url).then(res => res.json()) 用在 XML 上——json() 会解析失败并抛出 Unexpected token 。
- 确保响应头包含
Content-Type: application/xml或text/xml，否则DOMParser可能误判编码 - 若 XML 含有 BOM 或 UTF-8 带签名，
DOMParser通常能自动处理；但若出现乱码，可在text()后手动去除 BOM：str.replace(/^\uFEFF/, '') - 避免用
response.blob().then(blob => new FileReader().readAsText(blob))—— 多余且可能丢失原始编码声明
fetch('data.xml')
.then(res => {
if (!res.ok) throw new Error(`HTTP ${res.status}`);
return res.text();
})
.then(str => {
const parser = new DOMParser();
const doc = parser.parseFromString(str, 'application/xml');
if (doc.querySelector('parsererror')) {
throw new Error('XML parsing error: ' + str.substring(0, 200));
}
return doc;
})
.then(xmlDoc => {
const titles = xmlDoc.querySelectorAll('item title');
titles.forEach(el => console.log(el.textContent));
})
.catch(err => console.error('Load or parse failed:', err));
DOMParser 解析时要注意命名空间和编码
如果 XML 包含命名空间（如 querySelector('dc:title') 会返回空。此时需用 getElementsByTagNameNS 或传入命名空间 URI。
另外，XML 声明如 中的 encoding 属性，DOMParser 在大多数浏览器中**不遵守**——它只按响应头或 UTF-8 解码。所以服务端返回的编码必须与实际内容一致，否则中文会乱码。
立即学习“Java免费学习笔记（深入）”；
- 检测解析是否失败：检查
doc.documentElement.tagName === 'parsererror'或查询doc.querySelector('parsererror') - 若需处理带前缀的元素，先获取命名空间 URI：
const dcNS = xmlDoc.lookupNamespaceURI('dc');，再调用xmlDoc.getElementsByTagNameNS(dcNS, 'title') - 不要依赖
xmlDoc.inputEncoding—— 它在 Chrome/Firefox 中始终为null或UTF-8，不可靠
兼容旧浏览器？绕不开 XMLHttpRequest
IE11 及更早版本不支持 fetch 或 Response.xml，必须用 XMLHttpRequest。关键点是设置 request.responseType = 'document'，这样响应体可直接作为 XML 文档返回，无需手动解析字符串。
但这个模式下，IE 对跨域请求限制极严，且不支持 CORS 的 withCredentials 与 responseType: 'document' 共存——一旦需要带 cookie，只能退回到 responseType = 'text' + DOMParser，并自行处理编码。
- IE 中
new DOMParser()不支持第二个参数（MIME type），固定按 UTF-8 解析，所以 GBK 编码 XML 必须先转码或服务端统一用 UTF-8 - 使用
ActiveXObject('Microsoft.XMLDOM')是 IE6–8 的遗留方案，现在基本可忽略 - 若项目仍需支持 IE11，建议封装一个函数，优先用
fetch，降级到XMLHttpRequest时统一走responseType = 'text'路径
XML 解析后怎么安全取值？别直接用 .textContent
textContent 会拼接所有子文本节点，包括注释、CDATA 中的内容，还可能混入空白换行。真正健壮的做法是过滤掉空白文本节点，或使用 firstElementChild + textContent 组合。
更麻烦的是，XML 中常见 textContent 不会解码，需额外调用 DOMParser 或正则还原（但正则不可靠）。简单场景可用 innerHTML 配合临时元素：
- 取纯文本值：用
el.children.length ? el.children[0].textContent.trim() : el.textContent.trim() - 解码 HTML 实体：创建临时
div，设innerHTML = el.innerHTML，再读textContent - 避免
eval或Function解析 XML 属性中的 JS 表达式——XML 不是执行环境，这种需求应由服务端预计算
异步加载 XML 看似简单，但编码、命名空间、跨域、浏览器差异这四点，任一没对齐都会让解析结果为空或乱码。尤其容易被忽略的是：服务端返回的 Content-Type 和 XML 声明里的 encoding 必须一致，否则连 DOMParser 都救不了。
