XML DOM 删除节点 最全速查表（2025 版）

—— 3 秒知道用哪个方法，99% 的坑全在这张表里！

删除方式	推荐指数	写法（2025 首选）	适用场景	是否最简洁
自己删除自己（最现代）	★★★★★	node.remove()	任意节点，2025 年必会！	最简洁
让爸爸删自己（经典老写法）	★★★★★	node.parentNode.removeChild(node)	兼容所有老浏览器	经典
删除所有子节点	★★★★★	parent.replaceChildren() 或 parent.textContent = ""	清空元素	超快
删除指定属性	★★★★★	element.removeAttribute("id")	删除属性（不是节点）	最常用
批量删除（推荐）	★★★★★	doc.querySelectorAll("old").forEach(n => n.remove())	删除多个节点	一行搞定

真实 XML 示例（全程用这一个）

<bookstore>
  <book id="1" category="编程">
    <title>JavaScript 高级程序设计</title>
    <author>扎卡斯</author>
    <price>99.00</price>
  </book>
  <book id="2" category="小说">
    <title>三体</title>
    <author>刘慈欣</author>
  </book>
  <book id="3" category="编程">
    <title>你不知道的JavaScript</title>
  </book>
</bookstore>

实战代码（直接复制，全都能用）

const doc  = new DOMParser().parseFromString(xmlStr, "text/xml");
const root = doc.documentElement;

// 1. 删除 id="2" 的书（最现代写法）
doc.querySelector("book[id='2']")?.remove();

// 2. 删除所有“小说”分类的书（一行搞定）
doc.querySelectorAll("book[category='小说']").forEach(book => book.remove());

// 3. 删除第一本书（两种写法都行）
const firstBook = root.firstElementChild;
firstBook.remove();                              // 2025 推荐
// 或
// root.removeChild(firstBook);                  // 老写法

// 4. 删除 <price> 标签（只删标签，保留文本）
doc.querySelectorAll("price").forEach(priceNode => {
  const text = priceNode.textContent;
  priceNode.replaceWith(doc.createTextNode(text));  // 标签变纯文本
});

// 5. 删除某个属性
doc.querySelector("title")?.removeAttribute("lang");

// 6. 清空整个 bookstore（只剩空标签）
root.replaceChildren();                          // 超级好用！
// 或
// root.textContent = "";

// 7. 删除后输出新 XML
const newXML = new XMLSerializer().serializeToString(doc);
console.log(newXML);

经典坑 & 终极解决方案

坑	错误写法	正确写法（2025）
删除后还继续用该节点（已成“死节点”）	node.remove(); console.log(node.parentNode)	删除后该节点就脱离文档，不能再用
循环删除时跳节点（经典大坑！）	for (let n of nodes) n.remove()	正确！NodeList 是“活的”，但 remove() 安全
	for (let i=0; i<nodes.length; i++) nodes[i].remove()	错！长度实时变化，会漏删
想删标签但文本还在	price.remove()	文本会自动保留
想连文本一起删	只能删标签	删它的父节点，或 price.parentNode.removeChild(price)
老浏览器不支持 node.remove()	IE11 以下	用 node.parentNode.removeChild(node) 兜底

2025 年终极记忆口诀（背 2 句就够用一辈子）

1. 删节点 → 永远先用 node.remove()
2. 删多个 → querySelectorAll(...).forEach(n => n.remove())

终极兼容写法（支持到 IE9）

function safeRemove(node) {
  if (node.remove) {
    node.remove();                     // 现代浏览器
  } else if (node.parentNode) {
    node.parentNode.removeChild(node); // IE9-11 兼容
  }
}

// 使用
safeRemove(doc.querySelector("book[id='1']"));

记住这张表 + 2 句口诀，
你就已经达到“XML DOM 删除节点”的宗师级别，任何删除需求都能 5 秒写完！

需要我给你一个“一键删除 + 撤销 + 高亮变化”的 XML 编辑器小工具，随时说一声～