应使用 createelement() 创建、remove() 删除元素，注意 ie 兼容性需回退 parentnode.removechild()；动态表单中 name 属性必须用 items[] 格式，删除时须移除整个 dom 节点；表格操作优先用 insertrow()/deleterow()。
直接用 document.createElement() 创建，用 remove() 或 removeChild() 删除 —— 但关键不是“会不会”，而是“删得干净不干净”“name 属性崩没崩”。
创建元素必须用 createElement()，别拼字符串
用 innerHTML += 看似快，但会清空已有事件监听器、破坏焦点状态、触发重排，还容易引入 XSS（尤其拼接用户输入时）。createElement() 是唯一可控、可调试、可绑定事件的正路。
- 先
const el = document.createElement('div')，再设el.className、el.id、el.textContent（不用innerHTML除非真要渲染 HTML） - 若需插入带结构的内容（如一个带按钮的表单项），仍建议逐层
createElement+appendChild，而不是拼长字符串 - 避免
document.write()—— 页面加载后调用会清空整个文档
删除元素优先用 remove()，但得留意 IE 兼容性
remove() 是现代标准：调用 someElement.remove() 就完事，不用找父节点。但它在 IE 中完全不可用。
- 需要兼容 IE11 及更早版本时，必须回退到
parentNode.removeChild(someElement) - 别写成
someElement.parentNode?.removeChild(someElement)——?.removeChild在旧浏览器报错，得先判空再调用 - 删除前务必确认元素存在：
if (someElement && someElement.parentNode) { someElement.remove(); }
动态表单里删元素，name 属性才是雷区
很多人删了 DOM 却发现后端收不到数据，或收到稀疏数组，问题几乎全出在 name 上。
- ✅ 正确写法：
<input name="items[]">—— 浏览器自动按 DOM 顺序聚合成数组 - ❌ 错误写法：
<input name="items[0]">、<input name="items.0">、<input name="items[0][label]">—— 删除中间项后，后端解析结果缺索引或类型混乱 - 删除时必须移除整个包含该
input的 DOM 节点（比如<div class="form-item">），只清空 <code>value或只删input本身，提交时仍会带上空值表格行增删要用
insertRow()和deleteRow()，别手动操作tr表格有专用 API，比通用 DOM 方法更安全、语义更准，还能自动处理
tbody缺失等边界情况。- 添加行：
const row = table.insertRow(-1)（-1表示末尾），再对row调insertCell() - 删除行：
table.deleteRow(index)，index 从 0 开始；如果不确定行号，用row.rowIndex获取当前行在整表中的位置 - 注意：
deleteRow()不会抛错，哪怕 index 超界 —— 它只是静默失败，所以删前最好if (index >= 0 && index 校验一下
真正难的从来不是“怎么加一行”，而是删完之后，JS 数据模型、表单语义、后端接收逻辑三者是否还对得上。name 写错一次，排查两小时。
- 添加行：
