insertAdjacentElement 是原生 DOM 方法，支持 "beforebegin"、"afterbegin"、"beforeend"、"afterend" 四种精准插入位置，不重排父节点、不破坏子节点引用，仅适用于已挂载的 Element 节点。
insertAdjacentElement 是一个非常实用的 DOM 方法，它允许你在目标元素的指定位置（前、后、内部开头、内部结尾）直接插入一个已存在的元素节点，**不会创建新节点，也不会导致重排重绘浪费**，比 innerHTML + createElement 组合更高效、更安全。
四个插入位置参数要记牢
该方法接收两个参数：insertAdjacentElement(position, element)，其中 position 必须是以下字符串之一：
- "beforebegin"：插入到目标元素自身之前（成为其父元素的前一个兄弟节点）
- "afterbegin"：插入到目标元素内部开头（成为其第一个子节点）
- "beforeend"：插入到目标元素内部结尾（成为其最后一个子节点）
- "afterend"：插入到目标元素自身之后（成为其父元素的后一个兄弟节点）
⚠️ 注意：position 区分大小写，且必须是这四个固定值，传错会静默失败（返回 null）。
插入的是“已存在”的元素，原位置自动移除
这是关键点：你传入的 element 必须是一个真实存在的节点（比如通过 document.getElementById 或 document.createElement 创建后尚未挂载的节点）。如果它已经在 DOM 中，会先从原位置被移走，再插入到新位置 —— 这是移动而非复制。
当用户要求为 Java 代码添加注释、修改注释、审查注释、整理注释格式，或要求按照代码注释规范处理 Java 文件时，使用本技能。本技能用于统一生成和维护 Java 类注释模板、按 Git 对比 release 判断版本号、补充每行代码上方中文块注释、调整注释空行规则，并保持 Java 文件 UTF-8 无 BOM 编码。典型触发场景包括：补充类注释、更新 @version、检查 @author 来源、整理行尾注释、把注释放到代码上一行、检查注释是否符合规范、构建前检查 Java 注释风格。
立即学习“Java免费学习笔记（深入）”；
例如：
const box = document.getElementById('box');
const btn = document.querySelector('button');
// btn 原本在 body 最后，执行后会被移到 box 开头
box.insertAdjacentElement('afterbegin', btn);
常见搭配用法和注意事项
- 想插入新元素？先
createElement，再insertAdjacentElement，避免 innerHTML 解析风险 - 想把 A 元素插到 B 元素前面？用
B.insertAdjacentElement('beforebegin', A) - 想把 A 插进 B 的最里面开头？用
B.insertAdjacentElement('afterbegin', A) - 目标元素没有父节点（如刚创建未 append）时，
"beforebegin"和"afterend"会失败（因为无处可插），此时返回null - 不支持文本节点或 DocumentFragment 直接插入（会报错），需确保传入的是 Element 类型节点
对比 append / prepend / before / after 更直观
现代 DOM API 中，element.before()、element.after()、element.prepend()、element.append() 功能类似，但 insertAdjacentElement 兼容性更好（IE 支持）且语义更明确。如果你需要支持 IE 或偏好显式位置描述，优先选它。
