Ajax是一種用于在不重新加載整個網頁的情況下更新部分頁面內容的技術。通過Ajax，我們可以在網頁上動態顯示新增的信息，提升了用戶體驗和頁面性能。本文將以一個簡單的例子來說明如何使用Ajax將新增的信息顯示在文章中。
在我們的例子中，假設我們有一個博客網站，用戶可以在該網站上發布新的文章。當用戶提交一篇新文章時，我們希望能夠立即將其顯示在博客首頁，而不需要刷新整個頁面。這樣，其他用戶就可以即時看到最新發布的文章。
為了實現這個功能，我們可以使用Ajax來向服務器發送請求，獲取最新的文章數據，然后將其動態插入到頁面中。以下是一個簡化的示例代碼：

html
<!-- HTML部分 -->
<div>
<h2>最新文章</h2>
<div id="articles"></div>
</div>
<form id="new-article-form">
<input type="text" id="article-title" placeholder="文章標題">
<textarea id="article-content" placeholder="文章內容"></textarea>
<button type="submit">發布文章</button>
</form>
<pre id="ajax-script">
$(document).ready(function(){
$('#new-article-form').submit(function(event){
event.preventDefault(); // 阻止表單默認提交事件
var title = $('#article-title').val();
var content = $('#article-content').val();
// 使用Ajax發送POST請求
$.post('/api/articles', {title: title, content: content}, function(data){
// 在返回成功時更新頁面
$('#articles').prepend('<div><h3>' + data.title + '</h3><p>' + data.content + '</p></div>');
// 清空表單
$('#article-title').val('');
$('#article-content').val('');
});
});
});

在上述代碼中，我們使用了jQuery庫來簡化Ajax操作。當用戶提交發布文章的表單時，我們通過$.post方法向服務器發送一個POST請求，將文章的標題和內容作為數據傳遞給服務器。服務器處理完請求后返回一個包含最新文章信息的JSON對象。
在$.post方法中，第一個參數是請求的URL，我們假定服務器的文章API路徑為/api/articles。第二個參數是向服務器發送的數據，我們使用一個對象來包含文章的標題和內容。第三個參數是回調函數，當請求成功返回時將被調用。
回調函數中，我們首先通過$('#articles')選擇器找到頁面中用于顯示文章的容器元素，使用prepend方法將新文章的標題和內容插入到容器的最前面。這樣，最新發布的文章將會顯示在最頂部。接著，我們清空文章表單中的標題和內容，使其可以繼續輸入新的文章信息。
通過以上的代碼，我們可以實現當用戶發布新文章時，網站首頁會立即顯示最新的文章信息，無需重新加載整個頁面。這種動態更新的技術提升了用戶體驗，并提高了頁面性能。
總結起來，Ajax是一個強大的技術，可以使我們實現網頁的動態更新。通過向服務器發送異步請求，我們可以獲取最新的數據并在頁面中顯示出來。使用Ajax，我們可以提升用戶體驗和頁面性能，讓網站更加現代化和交互性。以上是一個簡單的例子，希望對你理解如何用Ajax將新增的信息顯示在文章中有所幫助。