.after()

.after() 和 .insertAfter() 方法执行相同的任务。主要区别在于语法——特别是内容和目标的位置。使用 .after() 时，要插入的内容来自方法的参数：$(target).after(contentToBeInserted)。相反，使用 .insertAfter() 时，内容位于方法之前，并插入到目标之后，而目标则作为 .insertAfter() 方法的参数传递：$(contentToBeInserted).insertAfter(target)。

使用以下 HTML

<div class="container">
  <h2>Greetings</h2>
  <div class="inner">Hello</div>
  <div class="inner">Goodbye</div>
</div>

可以创建内容并一次性插入到多个元素之后

$( ".inner" ).after( "<p>Test</p>" );

每个内部的 <div> 元素都会获得这个新内容

<div class="container">
  <h2>Greetings</h2>
  <div class="inner">Hello</div>
  <p>Test</p>
  <div class="inner">Goodbye</div>
  <p>Test</p>
</div>

也可以选择 DOM 中的一个元素并将其插入到另一个元素之后

$( ".container" ).after( $( "h2" ) );

如果以这种方式选择的元素被插入到 DOM 中其他地方的单个位置，它将被移动而不是被克隆

<div class="container">
  <div class="inner">Hello</div>
  <div class="inner">Goodbye</div>
</div>
<h2>Greetings</h2>

重要提示：但是，如果目标元素有多个，则除了最后一个目标外，都会为每个目标创建被插入元素的克隆副本。

传递函数

从 jQuery 1.4 开始，.after() 支持传递一个返回待插入元素的函数。

$( "p" ).after(function() {
  return "<div>" + this.className + "</div>";
});

此示例在每个段落之后插入一个 <div>，每个新 <div> 都包含其前置段落的类名。

额外参数

与其他内容添加方法（如 .prepend() 和 .before()）类似，.after() 也支持传入多个参数作为输入。支持的输入包括 DOM 元素、jQuery 对象、HTML 字符串和 DOM 元素数组。

例如，以下代码将在第一个段落后插入两个新的 <div> 和一个现有的 <div>

var $newdiv1 = $( "<div id='object1'></div>" ),
  newdiv2 = document.createElement( "div" ),
  existingdiv1 = document.getElementById( "foo" );
 
$( "p" ).first().after( $newdiv1, [ newdiv2, existingdiv1 ] );

由于 .after() 可以接受任意数量的额外参数，因此通过将三个 <div> 作为三个独立的参数传递，也可以实现相同的结果，如下所示：$( "p" ).first().after( $newdiv1, newdiv2, existingdiv1 )。参数的类型和数量将在很大程度上取决于代码中收集的元素。

• 在 jQuery 1.9 之前，如果集合中的第一个节点未连接到文档，.after() 会尝试在当前 jQuery 集合中添加或更改节点，并在这些情况下返回一个新的 jQuery 集合，而不是原始集合。该方法是否返回新结果可能取决于其参数的数量或连接性！从 jQuery 1.9 开始，.after()、.before() 和 .replaceWith() 始终返回原始未修改的集合。尝试在没有父节点的节点上使用这些方法没有效果——也就是说，集合及其包含的节点都不会改变。
• 根据设计，任何接受 HTML 字符串的 jQuery 构造函数或方法 —— jQuery()、.append()、.after() 等 —— 都有可能执行代码。这可能通过注入 script 标签或使用执行代码的 HTML 属性（例如 <img onload="">）发生。请勿使用这些方法插入从不受信任的来源（如 URL 查询参数、cookie 或表单输入）获取的字符串。这样做可能会引入跨站脚本 (XSS) 漏洞。在将内容添加到文档之前，请移除或转义任何用户输入。