AJAX (Asynchronous JavaScript and XML) 是一種用于在不刷新整個頁面的情況下，通過異步方式與服務器進行交互的技術。該技術常用于發送 POST 和 GET 請求，并處理返回的數據。POST 請求可以用于向服務器發送數據，GET 請求用于從服務器獲取數據。

舉例來說，假設我們正在開發一個電商網站，我們需要根據用戶輸入的關鍵字來搜索產品并展示結果。當用戶輸入關鍵字并點擊搜索按鈕時，我們可以通過 AJAX 發起一個 POST 請求，將用戶輸入的關鍵字發送給服務器進行處理。服務器可以根據關鍵字查詢數據庫，并返回與之相關的產品信息。然后，我們再通過 AJAX 從服務器接收到這些產品信息，并展示在網頁上，實現實時搜索的功能。

以下是一個使用 AJAX 同時進行 POST 和 GET 請求的示例代碼：

// 創建一個函數名為 searchProducts 的 AJAX 請求
function searchProducts() {
// 創建一個新的 XMLHttpRequest 對象
var xhr = new XMLHttpRequest();
// 設置請求的類型和 URL
xhr.open('POST', '/search', true);
// 設置請求的數據編碼方式
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
// 設置請求完成后的回調函數
xhr.onload = function() {
if (xhr.status === 200) {
// 從服務器返回的 response 中獲取產品信息
var products = JSON.parse(xhr.responseText);
// 將產品信息展示在頁面上
displayProducts(products);
}
};
// 獲取用戶輸入的關鍵字
var keyword = document.getElementById('search-input').value;
// 將關鍵字作為參數發送 POST 請求
xhr.send('keyword=' + keyword);
}
// 創建一個函數名為 displayProducts 的AJAX請求
function displayProducts(products) {
// 創建一個新的 XMLHttpRequest 對象
var xhr = new XMLHttpRequest();
// 設置請求的類型和 URL
xhr.open('GET', '/products', true);
// 設置請求的數據編碼方式
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
// 設置請求完成后的回調函數
xhr.onload = function() {
if (xhr.status === 200) {
// 從服務器返回的 response 中獲取產品信息
var products = JSON.parse(xhr.responseText);
// 將產品信息展示在頁面上
displayProducts(products);
}
};
// 將產品信息發送 GET 請求
xhr.send();
}

在上述示例代碼中，我們定義了兩個函數：searchProducts 和 displayProducts。searchProducts 函數用于發送 POST 請求，將用戶輸入的關鍵字發送給服務器；displayProducts 函數用于發送 GET 請求，從服務器上獲取產品信息。

使用 AJAX 同時進行 POST 和 GET 請求可以讓我們實現更加復雜和強大的功能。我們可以通過 POST 請求向服務器發送數據，從而更新服務器上的狀態或進行一些操作；然后通過 GET 請求從服務器獲取最新狀態或操作的結果。

總結來說，AJAX 技術能夠在不刷新整個頁面的情況下，通過異步方式與服務器進行交互，同時進行 POST 和 GET 請求。這種技術能夠大大提升用戶體驗，并且使得網站具有更加強大的功能和靈活性。