structuredclone 明确不支持 dom 节点（如 element、document），因其含不可序列化内部状态、与渲染引擎强耦合且存在复杂循环引用，调用时直接抛 datacloneerror；应改用 clonenode()、outerhtml 重建或手动构造等语义正确方案。
structuredClone 无法拷贝 DOM 节点，会直接抛出 DataCloneError 错误。这是浏览器规范明确限制的行为——DOM 对象（如 Element、Document、Node 等）不属于 structured clone algorithm 支持的类型列表，即使节点是“纯静态”的（比如一个刚创建但未挂载的 div），也会被拒绝。
为什么 structuredClone 不支持 DOM 节点
DOM 节点不是普通 JS 对象，它们：
- 包含不可序列化的内部状态（如事件监听器、布局信息、绑定的 JS 属性、ownerDocument 引用等）
- 与渲染引擎强耦合，跨上下文（如主线程 ↔ Worker）传递无意义且不安全
- 存在循环引用（父↔子、nextSibling↔previousSibling），structured clone 虽支持部分循环，但 DOM 结构过于复杂且未被设计为可克隆
替代方案：按需选择合适的方法
如果你确实需要复制 DOM 节点，应根据具体场景选用以下方式之一，而非强行用 structuredClone：
Java Maven Common
下载
Java Maven 项目审查工作流的通用输入处理。当 Java Maven 项目以 ZIP压缩包或 GitLab 仓库 URL 形式提供且需要...时使用。
-
用
cloneNode()复制节点树：最常用、语义最准确的方式。支持浅拷贝（false）和深拷贝（true），保留标签、属性、文本内容和子元素结构。
例：const copy = originalDiv.cloneNode(true); -
用
outerHTML+innerHTML字符串重建：适合简单、无事件/无动态状态的节点；注意会丢失绑定的事件监听器、JS 属性（如element.myData）、表单控件值（<input value="xxx">的当前值不会被outerHTML反映）、以及某些特殊节点（如<script></script>默认不执行）。 -
手动构造 + 属性遍历（高级定制）：适用于需过滤属性、转换结构或兼容旧环境。可结合
document.createElement()、getAttributeNames()、cloneNode(true)子节点后逐个处理。
如果数据中混有 DOM 节点，structuredClone 前要清理
例如你有一个对象：{ config: {}, node: document.querySelector('#app') }，直接 structuredClone(obj) 必然失败。正确做法是预先剥离/替换 DOM 字段：
- 序列化前移除 DOM 字段：
const safeObj = { ...obj, node: null }; - 或提取关键信息代替节点：
node: { tagName: node.tagName, id: node.id, className: node.className } - 若需后续还原，可配合
cloneNode在目标处重建，但需自行管理映射关系
不复杂但容易忽略：DOM 就是 DOM，它不该也不必进入 structured clone 流程。选对工具比硬套 API 更重要。
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
