jQuery中的append()和prepend(),after()和before()的差別

標籤：query   operator   lines   amp   jquer   tty   strong   ant   post   

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()的差別