jquery的dom操作方法中，包括了after与insertAfter，这两个方法名字相近，所实现的功能从名字中不容易分辨，所以在经过试验后撰文一篇以加深记忆。
测试代码如下：
<html>
<head>
<meta charset=”utf-8″>
<title>测试insertAfter与after的区别</title>
</head>
<body>
<ul>
<li class=”first”>first</li>
<li class=”middle”>middle</li>
<li class=”last”>last</li>
</ul>
</body>
</html>
自然状态下显示是这样的：
添加脚本：$(‘.first’).insertAfter($(‘.last’));
则会把first移到last后面去，变成了这样：
如果把insertAfter方法换为after，效果则为：
从上述对比可以看出，其实这两个方法的差别就像主语跟宾语的差别一样，是主与从的问题。
after方法，是把参数元素移到调用方法的元素的后面，而insertAfter方法则恰恰相反，是把调用方法的元素插入到参数元素的后面。
另外要注意的是，当要用这两个方法在dom树中添加新元素时,如”<li>new</li>”，这样的html字符串不能出现在after方法的调用主体或insertAfter的参数中，因为这样一来，jquery不知道要把新元素放到哪里去，反而会导致要相关的原有元素丢失。
相关推荐
jQuery中append、appendTo、prepend、prependTo、before、insertBefore、after与insertAfter方法注意事项
主要介绍了jQuery中的insertBefore(),insertAfter(),after(),before()区别介绍的相关资料,非常不错，具有参考借鉴价值，需要的朋友可以参考下
6.2.5 insertAfter(content) 97 6.2.6 insertBefore(content) 97 6.3 包裹 98 6.3.1 wrap(html) 98 6.3.2 wrap(elem) 99 6.3.3 wrap(fn) 99 6.3.4 unwrap() 100 6.3.5 wrapAll(html) 100 6.3.6 wrapAll(elem) 101 ...
一、after()和before()方法的区别 after()——其方法是将方法里面的参数添加到jquery对象后面去； 如：A.after(B)的意思是将B放到A后面去； before()——其方法是将方法里面的参数添加到jquery对象前面去。 ...
insertAfter(content) insertBefore(content) 包裹 wrap(html|ele|fn) unwrap() wrapall(html|ele) wrapInner(html|ele|fn) 替换 replaceWith(content|fn) replaceAll(selector) 删除 empty() remove(...
$.after( content ), .after( fn() ) $.before( content ), .before( fn() ) $.insertAfter( target ) $.insertBefore( target ) Inserting Around $.unwrap( ) $.wrap( wrappingElement ), .wrap( fn ) $.wrapAll...
提示：jQuery 使用的语法是 XPath 与 CSS 选择器语法的组合。在本教程接下来的章节，您将学习到更多有关选择器的语法。 文档就绪函数 您也许已经注意到在我们的实例中的所有 jQuery 函数位于一个 document ready ...
insertAfter(content) insertBefore(content) 包裹 wrap(html|ele|fn) unwrap() wrapAll(html|ele) wrapInner(html|ele|fn) 替换 replaceWith(content|fn) replaceAll(selector) 删除 empty() remove(...
与after方法相反 $("元素名称").clone(布尔表达式) 当布尔表达式为真时，克隆元素（无参时，当作true处理） $("元素名称").empty() 将该元素的内容设置为空 $("元素名称").insertAfter(content); 将该元素插入到...
insertAfter(content) insertBefore(content) 包裹 wrap(html) wrap(elem) wrapAll(html) wrapAll(elem) wrapInner(html) wrapInner(elem) 替换 replaceWith(content) replaceAll(selector) 删除 empty() ...
insertAfter(content) insertBefore(content) 包裹 wrap(html) wrap(elem) wrapAll(html) wrapAll(elem) wrapInner(html) wrapInner(elem) 替换 replaceWith(content) replaceAll(selector) 删除 empty() ...
jQuery 1.4.1 速查表 -- Shawphy, 原作:G. Scott Olson 核心 jQuery 核心函数 jQuery(expr, [context]) jQuery(html, [ownerDoc]) jQuery(html, props) jQuery(elements) jQuery() jQuery(callback) jQuery 对象访问...
本文实例讲述了JQuery中DOM节点的操作与访问方法。分享给大家供大家参考，具体如下： Jquery中DOM节点的操作 已有对象.append(要添加的对象) 作为最后一个子元素添加 要添加的对象.appendTo(已有对象) ...
after()和insertAfter()：在现存元素外部，从后面插入 before()和insertBefore():在现存元素外部，从前面插入 新建节点的插入 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"&...