jQuery中的append()和prepend(),after()和before()的差别
Posted yxysuanfa
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jQuery中的append()和prepend(),after()和before()的差别相关的知识,希望对你有一定的参考价值。
jQuery中的append()和preappend(),after()和before()的差别
append()和prepend()
如果
<div class=‘a‘> //<---you want div c to append in this
<div class=‘b‘>b</div>
</div>
使用
$(‘.a‘).append($(‘.c‘));
则会这样:
<div class=‘a‘> //<---you want div c to append in this
<div class=‘b‘>b</div>
<div class=‘c‘>c</div>
</div>
使用
$(‘.a‘).prepend($(‘.c‘));
则结果这样:
<div class=‘a‘> //<---you want div c to append in this
<div class=‘c‘>c</div>
<div class=‘b‘>b</div>
</div>
after()和before()
相同的上述代码,使用
$(‘.a‘).after($(‘.c‘));
结果:
<div class=‘a‘>
<div class=‘b‘>b</div>
</div>
<div class=‘c‘>c</div> //<----this will be placed here
使用
$(‘.a‘).before($(‘.c‘));
结果:
<div class=‘c‘>c</div> //<----this will be placed here
<div class=‘a‘>
<div class=‘b‘>b</div>
</div>
由上我们能够得出结论:
append() & prepend()实在元素内插入内容(该内容变成该元素的子元素或节点),after() & before()是在元素的外面插入内容(其内容变成元素的兄弟节点)。
以上是关于jQuery中的append()和prepend(),after()和before()的差别的主要内容,如果未能解决你的问题,请参考以下文章
jQuery中append(),prepend()与after(),before()的区别
jQuery 添加元素append() prepend() after() before()
jquery的append/prepend和after/before有什么区别呢?