Ajax 是一種在網頁上使用 JavaScript 進行異步通信的技術。它可以在不刷新整個網頁的情況下，通過后臺服務器請求數據并將其顯示在網頁上的指定區域。其中，Ajax GET 請求是一種常見的方式，它可以通過向服務器發送 GET 請求來獲取數據并在頁面上更新指定的 div 區域。下面將通過舉例說明來詳細介紹如何使用 Ajax GET 請求來刷新 div 區域的過程。 假設我們有一個網頁中的 div 元素，其 id 為 "content"，我們希望通過 Ajax GET 請求來更新這個 div 區域的內容。首先，我們需要使用 JavaScript 發出一個 GET 請求到指定的 URL，并通過該請求來獲取數據。這里以一個簡單的例子來說明： ```javascript var xhr = new XMLHttpRequest(); xhr.open("GET", "data.php", true); xhr.onreadystatechange = function() { if (xhr.readyState === 4 && xhr.status === 200) { document.getElementById("content").innerHTML = xhr.responseText; } }; xhr.send(); ``` 在上述代碼中，我們創建了一個 XMLHttpRequest 對象，然后使用 open 方法指定了一個 GET 請求的 URL，這里假設我們的后臺服務器是在 "data.php" 上監聽請求。接下來，我們使用一個匿名函數來監聽 XMLHttpRequest 對象的 onreadystatechange 事件，并判斷當請求的 readyState 屬性為 4（即請求完成）且狀態碼為 200（即請求成功）時，將返回的數據通過 innerHTML 方法賦給 "content" 元素的內容。 通過上述代碼，我們完成了一個簡單的 Ajax GET 請求的發送和獲取數據的過程。當網頁加載時，該請求將被發送到指定的 URL，并將返回的數據在 "content" 區域進行顯示。這樣，我們就實現了通過 Ajax GET 請求來刷新 div 區域的目標。 除了更新 div 區域，Ajax GET 請求還可以通過將獲取的數據在頁面上進行動態處理，來實現更復雜的功能。例如，我們可以根據返回的數據來更新頁面上的其他元素，或者根據獲取的數據進行計算和判斷等操作。下面是一個例子： ```javascript var xhr = new XMLHttpRequest(); xhr.open("GET", "data.php", true); xhr.onreadystatechange = function() { if (xhr.readyState === 4 && xhr.status === 200) { var data = JSON.parse(xhr.responseText); var total = 0; for(var i = 0; i< data.length; i++) { total += data[i]; } document.getElementById("total").innerHTML = "總數：" + total; } }; xhr.send(); ``` 在這個例子中，我們假設后臺服務器返回的是一個 JSON 格式的數據，其中包含了一些數值。在獲取數據后，我們使用 JSON.parse 方法將返回的數據轉換成 JavaScript 的對象，然后通過遍歷這個對象來計算數值的總和。最后，我們將計算得到的總和通過 innerHTML 方法賦給 id 為 "total" 的元素，實現了根據獲取的數據進行動態處理的功能。 通過上述舉例說明，我們可以看到 Ajax GET 請求能夠很方便地實現通過后臺服務器獲取數據，并在網頁上更新指定的 div 區域。它不僅可以用于簡單的數據展示，還可以通過動態處理數據來實現更復雜的功能。這為網頁開發提供了更多的靈活性和交互性，讓用戶能夠獲得更好的使用體驗。