javascript - $fn.insertAfter() 和 $fn.after() Jquery

Question

我知道这$fn.insertAfter()用于在作为参数提供的元素之后插入元素。和它有什么$fn.after()不同？

Answer 1

$.fn.after()^help在您调用它的目标元素之后插入一个元素

$('div').after('<div>new div</div>');

然而，$.fn.insertAfter在您指定的节点之后插入目标元素：

$('<div>new div</div>').insertAfter($('#someid'));

后者最受青睐，因为您保留对新创建元素的引用，并且可以在其上链接更多方法。例如：

$('<div>new div</div>')
   .insertAfter($('#someid'))
   .attr('foo', 'bar')
   .css({
      'background-color': 'red'
   });

是可能的。你不能在.after()^帮助的情况下做到这一点。同样的事情是.append()^帮助/.appendTo()^帮助和.insertBefore()^帮助/.before()^帮助

Answer 2

这是同一件事的一个例子，不同的是选择器的上下文。insertAfter在参数之后插入所选元素 在所选元素之后 after插入参数。

$('<div id="foo"></div>').insertAfter('#bar');
$('#bar').after('<div id="foo"></div>');

Answer 3

直接从文档中引用：

.after()和.insertAfter() 方法执行相同的任务。主要区别在于语法——特别是内容和目标的位置。使用 .after()，方法前面的选择器表达式是插入内容的容器。.insertAfter()另一方面，内容在方法之前，作为选择器表达式或作为动态创建的标记，它被插入到目标容器之后。

Answer 4

这提到它们执行相同的任务但具有不同的语法。