JavaScript 原生实现 insertAfter 函数及 jQuery 用法解析

 
需要明确的是，标准 DOM 规范中并未直接提供 insertAfter() 方法。
我们可以定义一个名为 insertAfter 的函数，该函数接收两个参数：需要插入的新元素 newElement 和目标元素 targetElement。
首先获取目标元素的父节点，赋值给变量 parent。
接着判断父节点的最后一个子节点是否就是目标元素本身。
如果条件成立，说明目标元素已经是父节点的最后一个子节点，此时直接将新元素追加到父节点末尾即可，这符合默认行为。
执行 parent.appendChild(newElement) 完成添加。
} 
如果上述条件不成立，即目标元素不是最后一个子节点，则进入 else 分支处理。
此时调用 parent.insertBefore(newElement, targetElement.nextSibling)，将新元素插入到目标元素的下一个兄弟节点之前。
这种操作逻辑实际上实现了将新元素放置在目标元素之后的效果。
} 
} 

jQuery 中的 insertAfter 方法

此外，如果使用 jQuery 库，可以直接使用其文档操作中的 insertAfter() 方法，用法更为简洁。