17370845950

JavaScript遍历XML节点需先用DOMParser解析字符串为Document对象，再通过children、getElementsByTagName或querySelectorAll等API安全访问元素节点，避开文本节点干扰，并可递归遍历全部元素。

JavaScript 中遍历 XML 节点主要依靠原生 XML DOM API，核心是把 XML 字符串解析为 Document 对象，再用类似 HTML DOM 的方式（如 childNodes、getElementsByTagName、querySelector 等）访问和遍历节点。关键在于正确解析、识别节点类型、避开文本节点干扰。

解析 XML 字符串为 DOM 文档

浏览器中不能直接用 new DOMParser() 解析不规范的 XML（比如含 BOM、编码错误或自闭合标签写法不当），需确保字符串格式合法：

• 使用 DOMParser 解析（现代浏览器支持）：
  

  const parser = new DOMParser();
  const xmlDoc = parser.parseFromString(xmlStr, "application/xml");

  
  解析失败时，xmlDoc.querySelector("parsererror") 会存在，可据此判断是否出错。
• IE8/9 需用 ActiveXObject("Microsoft.XMLDOM")（已过时，仅作兼容参考）。

区分节点类型，安全遍历 childNodes

childNodes 包含元素节点、文本节点（换行缩进）、注释节点等。直接遍历易报错或跳过目标节点：

• 只处理元素节点（nodeType === 1）：
  

  for (let node of parent.childNodes) {
    if (node.nodeType === 1) { /* 处理元素 */ }
  }

• 更简洁：用 children（只返回元素子节点，忽略文本/注释）：
  for (let elem of parent.children) { /* elem 是 Element 类型 */ }

按标签名或属性快速定位并遍历

比递归遍历更高效，适合有明确结构的 XML：

• 获取所有同名元素：
  

  const items = xmlDoc.getElementsByTagName("item");
  Array.from(items).forEach(item => { /* 处理每个 item 元素 */ });

• 用 querySelectorAll 支持 CSS 选择器：
  

  const titles = xmlDoc.querySelectorAll("book title");
  titles.forEach(el => console.log(el.textContent));

• 读取属性值：
  

  const id = item.getAttribute("id");
  // 或 el.attributes["id"]?.value

递归遍历全部元素节点（深度优先）

适合结构未知或需统一处理所有元素的场景：

• 简单递归函数示例：
  

  function walkElements(node) {
    if (node.nodeType !== 1) return;
    console.log(node.tagName, node.textContent.trim());
    for 
  (let child of node.children) {
      walkElements(child);
    }
  }
  walkElements(xmlDoc.documentElement);

• 注意：避免对 textContent 直接全量取值——深层嵌套时可能包含大量空白或无关文本，建议用 node.innerText（部分浏览器支持）或针对性取子元素内容。