clonenode(true)递归克隆整个dom子树，clonenode(false)仅克隆当前节点；前者适合复制完整结构，后者适用于空容器复用，二者均不复制事件监听器、表单运行时值或触发脚本执行。
cloneNode(true) 和 cloneNode(false) 的区别必须分清
克隆元素时最常踩的坑，就是没搞懂布尔参数的意义。cloneNode(false) 只复制当前节点本身（比如一个 <div> 标签），不带任何子节点；<code>cloneNode(true) 才会递归复制全部后代节点。如果你克隆后发现内容空了，大概率是传了 false 却期望拿到完整结构。
注意：这个布尔值和“是否深克隆”完全对应，不是“是否保留事件”或“是否保留样式”——它只管 DOM 树结构。
-
cloneNode(false)适合克隆空容器（如清空后复用的<ul></ul>） -
cloneNode(true)是日常多数场景的选择，比如复制表单项、列表项 - 克隆出来的节点默认不绑定事件——哪怕原节点有
addEventListener，新节点也不会继承
克隆后必须手动 append 才能显示在页面上
cloneNode 返回的是一个孤立的 DOM 节点，它不在文档流中，也不属于任何父元素。直接调用后页面不会有任何变化。
常见错误写法：el.cloneNode(true); —— 这行代码什么都不会显示出来。
- 必须显式插入：比如
parent.appendChild(el.cloneNode(true)) - 如果想插到某个位置前，用
parent.insertBefore(newNode, refNode) - 克隆节点的
id属性也会被复制，可能导致重复id，后续用document.getElementById会出问题
表单元素克隆后 value 和 checked 状态不会自动同步
输入框、选择框、复选框这些表单控件的当前值（value、checked、selected）属于“运行时状态”，不属于 DOM 属性，所以 cloneNode 不会复制它们。
比如用户在 <input type="text"> 中打了字，克隆出来的节点 value 仍是初始值（空字符串或 defaultValue）。
- 需要手动同步：克隆后立刻赋值，如
newInput.value = oldInput.value -
textarea同理，要操作value，而不是textContent -
select多选需遍历options设置selected
克隆 script、style、iframe 等特殊节点的行为要格外小心
cloneNode 对某些节点类型有隐式限制：克隆 <script></script> 不会重新执行；克隆 <style></style> 会复制样式文本但不会触发重计算；克隆 <iframe></iframe> 会复制标签，但其中的文档和状态（如滚动位置、JS 上下文）不会被复制。
- 不要指望克隆
<script></script>来动态加载逻辑，它只是个静态副本 - 克隆含
src的<script></script>或<img>，属性还在，但不会触发二次加载（除非你手动设置src触发） - 若需完整行为复现（比如重载 iframe 内容），得用其他方式，比如重建节点 +
setAttribute
getElementById 拿到了意料之外的元素。
