在Web開發中，經常遇到需要實時刷新頁面內容的需求。在以往的技術中，要實現內容的實時刷新通常需要刷新整個頁面，這樣用戶體驗較差且效率低下。而使用Ajax（Asynchronous JavaScript and XML）技術可以局部刷新網頁內容，提高用戶體驗和網站性能。

下面將通過幾個代碼案例來詳細說明如何使用Ajax刷新指定的<div>元素。

案例一：通過點擊按鈕實現Ajax刷新

$('button').click(function(){
$.ajax({
url: 'data.php',  \\ 這里的data.php是一個示例服務器端腳本，用于返回要刷新的<div>元素的內容
data: {
// 可選的請求參數
},
success: function(response){
$('div').html(response);  \\ 刷新<div>元素的內容
},
error: function(){
// 錯誤處理
}
});
});

在這個例子中，通過點擊按鈕觸發Ajax請求。當請求成功返回后，使用response參數中的內容更新頁面上的<div>元素。這樣，用戶在點擊按鈕后，就能夠實時更新頁面內容，而不需要刷新整個頁面。

案例二：定時刷新<div>元素

function refreshDiv() {
$.ajax({
url: 'data.php',
data: {
// 可選的請求參數
},
success: function(response){
$('div').html(response);
},
error: function(){
// 錯誤處理
},
complete: function(){
setTimeout(refreshDiv, 5000);  \\ 每隔5秒鐘調用一次refreshDiv函數，來重新刷新<div>元素
}
});
}
<br>
$(document).ready(function(){
refreshDiv();
});

這個代碼示例中，定義了一個名為refreshDiv的函數，這個函數使用Ajax請求來獲取最新的<div>元素的內容。在函數的complete回調函數中，使用setTimeout函數來每隔5秒鐘調用一次refreshDiv函數，從而實現定時刷新頁面內容。

通過這兩個案例，我們簡單介紹了如何使用Ajax刷新指定的<div>元素。通過Ajax技術，我們可以在不刷新整個頁面的情況下，實現頁面內容的實時更新，從而提高了用戶體驗和網站性能。