dom元素的不常用属性可用createattribute和setattributenode精确控制：前者创建未挂载的attr节点，后者将其挂载到元素上并支持替换返回旧节点，适用于复用、框架封装等场景。
DOM元素的不常用属性（比如spellcheck、contenteditable、draggable，或自定义data属性以外的非标准属性）可以用createAttribute和setAttributeNode来精确控制——尤其适合需要动态创建、复用、或保留原始属性节点引用的场景。
createAttribute 创建独立的属性节点
createAttribute返回一个未挂载的Attr对象，它不是字符串，而是完整的DOM节点（类型为Attr），可单独设置值、修改、甚至传给其他元素。它适合需要预设或延迟绑定的属性。
- 语法简单：
const attr = document.createAttribute("spellcheck"); - 必须手动赋值：
attr.value = "false";（不能用attr.textContent） - 创建后不自动关联任何元素，需配合
setAttributeNode才生效 - 对布尔属性（如
hidden、disabled）也适用，但值设为空字符串或"true"/"false"取决于语义（例如spellcheck="false"是有效值，而hidden=""等价于hidden）
setAttributeNode 挂载属性节点
setAttributeNode把已创建的Attr节点挂载到目标元素上。如果同名属性已存在，会用新节点替换旧节点，并返回被替换的节点（可用于备份或判断）。
- 挂载后，属性立即生效：
el.setAttributeNode(attr); - 支持替换逻辑：若元素已有
draggable属性，再次调用会覆盖，并返回原Attr节点 - 返回值是被替换的节点（首次设置时返回
null），可用于条件处理：if (oldAttr) { console.log("replaced", oldAttr.name); } - 与
setAttribute不同，它不解析字符串，完全按节点对象操作，更适合封装属性模板或批量管理
什么时候该用 createAttribute + setAttributeNode？
多数日常场景用el.setAttribute("name", value)更简洁。但以下情况值得考虑节点方式：
- 需要复用同一属性配置到多个元素（先
createAttribute一次，再多次setAttributeNode） - 要监听或拦截属性变更（
Attr节点本身可被观察，虽然实际中较少用） - 构建工具类或框架内部逻辑，需统一管理属性生命周期（如保存、克隆、序列化
Attr节点） - 处理XML文档或严格区分“存在性”和“值”的场景（例如
xml:lang属性是否显式声明）
注意兼容性和常见误区
这两个方法在所有现代浏览器中都支持，但要注意几个细节：
-
createAttribute不能用于HTML全局事件属性（如onclick），它们属于元素的JS属性，应直接赋值：el.onclick = handler; - 自定义属性推荐用
data-*前缀，此时setAttribute和setAttributeNode效果一致，但前者更直观 -
getAttributeNode可获取已挂载的Attr节点，配合removeAttributeNode实现精准移除（比removeAttribute多一层控制） - 不要混淆
Attr和Element：属性节点没有parentNode，其ownerElement指向所属元素，但不能当普通子节点操作
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
