jQuery是一個著名的JavaScript庫，為客戶端網頁開發提供了很多便利的API。其中，append()和after()是常用的兩個函數，用于在DOM樹中動態添加元素。

append()函數接收一個或多個參數，將它們添加到jQuery對象代表的DOM元素的結尾處。例如，下面的jQuery代碼在id為"container"的div元素里添加了一個p元素：

$( "#container" ).append( "
Hello, world!
" );

這段代碼的效果等同于下面的HTML：

<div id="container">
...
<p>Hello, world!</p>
</div>

after()函數接收一個或多個參數，將它們添加到jQuery對象代表的DOM元素的后面。例如，下面的jQuery代碼在id為"content"的div元素后面添加了一個p元素：

$( "#content" ).after( "
Goodbye, world!
" );

這段代碼的效果等同于下面的HTML：

<div id="content">
...
</div>
<p>Goodbye, world!</p>

append()和after()函數都可以接收一個函數作為參數，并在每個元素上調用這個函數。這個函數的返回值將被添加到元素的結尾或后面。例如，下面的jQuery代碼在id為"list"的ul元素里添加了5個li元素：

$( "#list" ).append( function( index ) {
return "<li>Item " + ( index + 1 ) + "</li>";
});

這段代碼的效果等同于下面的HTML：

<ul id="list">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
<li>Item 5</li>
</ul>

總之，append()和after()函數是jQuery中非常有用的DOM操作函數，可以幫助我們動態地修改網頁內容。