XML DOM 改变节点值 最全速查表（2025 版）

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

你想改什么？	推薦写法（2025 首选）	备选（老项目）	是否会自动转义 < > &	必背度
改元素内的全部文本	element.textContent = "新文本"	element.innerText = "新文本"	自动转义	★★★★★
改单个文本节点	textNode.nodeValue = "新文本"	textNode.data = "新文本"	自动转义	★★★★
改属性值	element.setAttribute("id", "100")	element.attributes["id"].value = "100"	不转义（属性值本来就不需要）	★★★★★
删除属性	element.removeAttribute("old")	element.attributes.removeNamedItem("old")	—	★★★★★
改整个 XML 某段（危险操作）	先取节点 → 改 textContent → 再序列化输出	—	自动转义	★★★★

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

<bookstore>
  <book id="1" category="编程">
    <title lang="zh">JavaScript 高级程序设计</title>
    <author>扎卡斯</author>
    <price>99.00</price>
  </book>
</bookstore>

实战代码（直接复制，所有都能成功）

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

// 1. 改书名（最常用！）
book.querySelector("title").textContent = "JavaScript 高级程序设计（第4版）";

// 2. 改价格为 79.00（数字转字符串也 OK）
book.querySelector("price").textContent = "79.00";

// 3. 改属性：把 category 改成 “前端经典”
book.setAttribute("category", "前端经典");

// 4. 改 id 为 999
book.setAttribute("id", "999");

// 5. 删除 lang 属性
book.querySelector("title").removeAttribute("lang");

// 6. 批量改所有书的分类（超级常用）
doc.querySelectorAll("book").forEach(b => {
  b.setAttribute("category", "计算机图书");
});

// 7. 把修改后的 XML 输出为字符串（保存/发送）
const newXML = new XMLSerializer().serializeToString(doc);
console.log(newXML);

经典坑 & 终极解决方案

坑	错误写法	正确写法（2025）
用 innerHTML 改 XML（会报错或乱码）	element.innerHTML = "<b>加粗</b>"	XML 不支持 innerHTML！必须用 textContent
想写 < > & 等特殊字符却被转义了	textContent = "<script>alert(1)</script>"	正确！DOM 自动转成安全字符，防止注入
想保留原始 < >（比如代码片段）	用 textContent（会被转义）	改用 CDATA：element.appendChild(doc.createCDATASection("<b>加粗</b>"))
修改后页面没变化（忘了重新序列化）	只改 DOM 树，页面还是旧的	必须 new XMLSerializer().serializeToString(doc) 重新输出
改属性大小写不一致导致找不到	setAttribute("ID", "100")	XML 属性区分大小写，统一用小写

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

1. 改文本 → 永远只用 textContent = "新文本"
2. 改属性 → 永远只用 setAttribute("name", "value")
3. 删属性 → 永远只用 removeAttribute("name")

特殊需求终极方案

需求	一行代码搞定（2025）
插入不转义的 HTML/XML 代码片段	node.appendChild(doc.createCDATASection("<b>粗体</b>"))
把某个节点内容整个替换	parent.replaceChild(newNode, oldNode)
安全地把用户输入放进 XML	先 textContent = userInput（自动转义）
把修改后的 XML 保存到文件/发送给后端	new XMLSerializer().serializeToString(doc)

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

需要我给你一个“一键修改 + 高亮变化 + 实时预览”的 XML 编辑器小工具，随时说一声～