jquery添加中append和after的區別

首先假設我們有個id爲test的div和一個id爲test2的div：

<span style="font-size:18px;"><div id="test">
    我是測試div
</div>
<div id="test2">
    我是test2！
</div></span>

append是在指定元素內部比如：

<span style="font-size:18px;">$("#test").append("<div>測試文字</div>");
</span>

執行結果：

<span style="font-size:18px;"><div id="test">
    我是測試div
    <div>測試文字</div>
</div>
<div id="test2">
    我是test2！
</div>
</span>

而after則是在指定元素外部且緊挨着：

<span style="font-size:18px;">$("#test").after("<div>測試文字</div>");
</span>

執行結果：

<span style="font-size:18px;"><div id="test">
    我是測試div
</div>
<div>測試文字</div>
<div id="test2">
    我是test2！
</div>
</span>

其實就是一個在元素內部生成和元素外部生成的區別。

而其中的prepend和before同理~