XML DOM – Node 对象 最全速查表（2025 版）

—— 所有节点（元素、文本、属性、注释……）的“共同祖宗”，掌握它就掌握了 DOM 底层！

属性 / 方法	返回值类型	说明（2025 实战口诀）	必背度	99% 项目是否常用
nodeType	Number (1~12)	节点类型（1=元素，3=文本，2=属性，8=注释，9=文档）	★★★★★	超级常用
nodeName	String	节点名称（标签名 / “#text” / “#comment” / “#document”）	★★★★★	超级常用
nodeValue	String | null	节点的值（文本、属性、注释、CDATA 有值，其他 null）	★★★★★	常用
textContent	String | null	元素及其后代全部文本（最推荐取文本方式！）	★★★★★	100% 项目必用
parentNode	Node | null	父节点（往上走）	★★★★★	超级常用
childNodes	NodeList	所有子节点（含空白文本！）	★★★★	慎用
children	HTMLCollection	只包含元素子节点（自动跳过空白，强烈推荐！）	★★★★★	强烈推荐
firstChild / lastChild	Node | null	第一个/最后一个子节点（常是空白文本）	★★★	少用
firstElementChild / lastElementChild	Element | null	第一个/最后一个元素子节点（跳过空白，2025 必写！）	★★★★★	强烈推荐
previousSibling / nextSibling	Node | null	上一个/下一个兄弟节点（常是空白）	★★★	少用
previousElementSibling / nextElementSibling	Element | null	上一个/下一个兄弟元素（跳过空白，2025 必写！）	★★★★★	强烈推荐
attributes	NamedNodeMap | null	元素的所有属性集合（只有元素节点有）	★★★★	常用
ownerDocument	Document	所属的文档对象（创建新节点时常用）	★★★★	常用
cloneNode(deep)	Node	克隆节点（deep=true 复制子树）	★★★★★	超级常用
appendChild(node)	Node	添加子节点（经典老方法）	★★★★★	常用
removeChild(node)	Node	删除子节点（老方法）	★★★★	可用
replaceChild(new, old)	Node	替换子节点（老方法）	★★★★	可用
hasChildNodes()	Boolean	是否有子节点	★★★	少用
normalize()	void	合并相邻文本节点、删除空文本	★★	偶尔用

2025 年最常用 8 个属性（背会这 8 个就打遍天下）

node.nodeType                    // 1=元素，3=文本
node.nodeName                    // 标签名或 "#text"
node.textContent                 // 取/改文本（神器！）
node.parentNode                  // 爸爸
node.children                    // 所有亲儿子（跳过空白）
node.firstElementChild           // 大儿子（跳过空白）
node.lastElementChild            // 小儿子
node.nextElementSibling          // 下一个兄弟（跳过空白）

实战终极判断代码（复制到项目一辈子够用）

function describeNode(node) {
  if (!node) return "null";

  const type = node.nodeType;
  if (type === 1) return `<${node.tagName}> 元素节点`;
  if (type === 3) return `文本："${node.nodeValue.trim() || '(空白)'}"`;
  if (type === 2) return `属性：${node.name}="${node.value}"`;
  if (type === 8) return `注释：<!-- ${node.nodeValue.trim()} -->`;
  if (type === 9) return "整个文档";
  return `其他节点类型：${type}`;
}

// 只遍历元素节点（99% 项目都这么写）
for (let child of parent.children) {          // 自动跳过空白文本！
  console.log(child.tagName);
}

// 安全往上找父元素（跳过文本节点）
function getParentElement(node) {
  while (node && node.nodeType !== 1) {
    node = node.parentNode;
  }
  return node;
}

2025 年铁律（永远记住这 3 条）

1. 永远优先用带 Element 的版本（firstElementChild、children、nextElementSibling）
2. 永远用 textContent 取/改文本（别用 nodeValue + firstChild）
3. 永远用 nodeType === 1 判断是不是元素节点

一张图记住 Node 对象所有关系

Node（所有节点的爸爸）
├── Element（nodeType=1） → tagName, attributes, children
├── Text（nodeType=3） → nodeValue
├── Attr（nodeType=2） → name + value
├── Comment（nodeType=8） → nodeValue
├── Document（nodeType=9） → documentElement
└── 其他冷门节点

记住上面这张表 + 8 个核心属性 + 3 条铁律，
你就已经完全掌握了 XML DOM 中最底层的 Node 对象，
再复杂的遍历、修改、克隆操作都能 10 秒写出来！

需要我给你一个“一键查看任意 Node 对象所有属性值的 Chrome 调试工具”，随时说一声～