今天網(wǎng)上查資料的時候看到了 append與prepend 現(xiàn)在總結(jié)下以上幾個方法的區(qū)別
利用代碼展示,例子
html
<div class="test1"><p>這個是用來測試append的</p></div>
<ul class="test2"><li></li></ul>
<script>
$(document).ready(function(){
var txt1=$( " <b></b>").text("love");
$(".test1").append(txt1);
alert($(".test1").html)
})
</script>
顯示結(jié)果：
先是彈出，test1下所有的子元素爷怀，其中新增的<b></b>在test1中
此處我們再稍微寫下appendTo方法與append的區(qū)別
以上個例子的HTML為模板
var txt = $("").text("love appendTo");? ? ? ? ??
? txt.appendTo(".test1") ? ? ? ??
? ?alert("append-----"+$(".test1").html())
由此可見阻肩，append與appendTo的作用是一樣的，只不過是寫法是反的运授，假如div里面想增加一個a烤惊，如果是append的話$("div").append(a),如果是appendTo的話，就要返回來徒坡，$("div").append(a)
第二個例子：
<div class="test2"><p>這個是用來測試after的</p></div>
var txt2=$( "").text("hello world");? ? ? ? ? ?
?$(".test2").after(txt2)? ? ? ? ? ??
alert("after+++++"+$(".test2").html())
展示結(jié)果如下：
彈出所有的子元素撕氧，<i></i>并不在test2下面
prepend與before與上述類似。
總結(jié)如下：
append() & prepend()是在元素內(nèi)插入內(nèi)容（該內(nèi)容變成該元素的子元素或節(jié)點(diǎn)）喇完，after() & before()是在元素的外面插入內(nèi)容（其內(nèi)容變成元素的兄弟節(jié)點(diǎn)）
1伦泥、append() - 在被選元素的結(jié)尾插入內(nèi)容
2、prepend() - 在被選元素的開頭插入內(nèi)容
