after()方法在目标元素后插入兄弟节点，如$('#box1').after('新增')将新div插入#box1之后，支持HTML字符串、DOM元素或jQuery对象，与insertAfter()区别在于调用主体不同。
在 jQuery 中，after() 方法用于在指定元素的外部后面插入内容或元素。也就是说，新内容会被插入到目标元素之后，作为其下一个兄弟元素。
基本语法
$(selector).after(content)- selector：要操作的目标元素
- content：要插入的内容，可以是 HTML 字符串、DOM 元素、jQuery 对象等
使用示例
假设有如下 HTML 结构：
第一个盒子
第二个盒子
现在我们想在 #box1 后面添加一个新的 div：
$('#box1').after('新增的盒子
');
执行后，HTML 变为：
第一个盒子
新增的盒子
第二个盒子
插入多种类型内容
after() 支持多种参数形式：
-
字符串（HTML）：
.after('文本段落
') -
DOM 元素：
.after(document.createElement('span')) -
jQuery 对象：
.after($('#someElement'))—— 注意这会把原元素移动位置
与 insertAfter() 的区别
两者功能相似，但调用方式不同：
-
after()：调用在目标元素上：
$('#target').after('new') -
insertAfter()：调用在要插入的内容上：
$('new').insertAfter('#target')
基本上就这些。使用 after() 方法能快速在元素后插入内容，适合动态生成结构或提示信息。注意插入的是兄弟节点，不是子节点。不复杂但容易忽略细节，比如移动元素时原位置会消失。
