html5safari解析xml差异_针对safari的节点获取兼容方案【介绍】_技术教程

Safari中XMLHttpRequest.responseXML常为null，因MIME校验严格、BOM或编码不匹配；DOMParser解析易失败且节点名小写化；getElementsByTagName大小写敏感且不支持通配符；应统一用responseText+DOMParser+XPath并加错误兜底。

XMLHttpRequest.responseXML 在 Safari 中返回 null

Safari（尤其是 iOS 15+ 和 macOS Monterey 后版本）对 XMLHttpRequest 加载 XML 的 MIME 类型校验更严格：即使服务器返回 text/xml，若响应头中缺少 charset=utf-8 或实际内容含 BOM/编码不匹配，responseXML 就会是 null，而 Chrome/Firefox 可能仍能解析。

检查响应头：Content-Type: text/xml; charset=utf-8 必须存在且与实际编码一致
避免用 responseXML 直接取节点，改用 responseText + 手动解析
服务端输出 XML 前确保无 UTF-8 BOM（常见于 Windows 编辑器保存）

DOMParser.parseFromString 解析失败或节点名全小写

Safari 的 DOMParser 对 XML 命名空间和大小写更敏感，尤其当 XML 声明含 encoding="UTF-8" 但内容实际为无 BOM UTF-8 时，可能静默失败；另外，未声明命名空间的自定义标签（如）在 Safari 中解析后 nodeName 可能变成小写 myitem，导致 getElementsByTagName('MyItem') 返回空。

统一用 parseFromString(xmlStr, 'application/xml')，不要用 text/xml

解析后立即检查 parsererror 元素：

const doc = parser.parseFromString(xmlStr, 'application/xml');
if (doc.querySelector('parsererror')) {
  throw new Error('XML parse error in Safari');
}

节点查询改用 querySelector 或正则预处理标签名（如 xmlStr.replace(/）

getElementsByTagName 区分大小写且不支持通配符

Safari 的 XML 文档中 getElementsByTagName 严格区分大小写，且不支持 * 通配符（Chrome 允许 getElementsByTagName('*')），同时对命名空间前缀（如 ns:Item）默认不识别，除非显式创建命名空间感知的解析器。

避免依赖大小写模糊匹配，提前标准化 XML 标签名（服务端输出统一小写或 PascalCase）

不用 getElementsByTagName('*')，改用 document.evaluate 配合 XPath：

const xpath = '//*';
const result = document.evaluate(xpath, doc, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
for (let i = 0; i < result.snapshotLength; i++) {
  const node = result.snapshotItem(i);
  // 处理 node
}

若需命名空间支持，必须传入 DOMParser 第二参数为 'application/xml' 并在 XML 中声明 xmlns

textContent 与 innerHTML 在 XML 节点中行为不一致

XML 节点没有 innerHTML 属性（Safari 报 undefined），而 textContent 在含 CDATA 或实体字符（如）时，Safari 返回原始文本（含字符串），Chrome 可能自动解码。直接拼接或渲染易出错。

永远不要对 XML 节点调用 innerHTML —— 它不存在，用 textContent 或 firstChild?.nodeValue

提取纯文本内容前先移除 CDATA 包裹：

function getRawText(el) {
  return el.textContent.replace(/<\!\[CDATA\[([\s\S]*?)\]\]>/g, '$1');
}

若需 HTML 渲染 XML 内容，先用 XMLSerializer 序列化再转义：

const serializer = new XMLSerializer();
const xmlStr = serializer.serializeToString(el);
const escaped = xmlStr.replace(/[&<>"']/g, c => `&#${c.charCodeAt(0)};`);