Ajax，全稱Asynchronous JavaScript and XML，即使用異步的方式進行數據傳輸和更新頁面內容的技術。通過Ajax，我們可以在不刷新整個頁面的情況下，向服務器發送請求并接收響應數據，然后用JavaScript動態更新頁面的內容。Ajax廣泛應用于Web開發中，特別適用于需要頻繁刷新數據的場景，如社交媒體的實時消息推送、購物網站的商品搜索和評論加載等。

要實現使用Ajax傳輸數據，需要用到以下幾個關鍵的步驟。

首先，我們需要創建一個XMLHttpRequest對象，該對象是Ajax技術核心的一部分，負責與服務器進行數據交互。我們可以使用以下代碼來創建一個XMLHttpRequest對象。

var xhr = new XMLHttpRequest();

接下來，我們需要指定服務器的URL，通過調用XMLHttpRequest對象的open()方法來實現。這里需要指定請求的方法（GET或POST）以及要請求的URL。

xhr.open("GET", "https://api.example.com/data", true);

然后，我們還可以設置一些HTTP請求頭信息，例如Content-Type、Authorization等。以下是一個設置Content-Type為application/json的例子。

xhr.setRequestHeader("Content-Type", "application/json");

接下來，我們需要設置XMLHttpRequest對象的回調函數，以便在數據返回時進行相應的處理。XMLHttpRequest對象提供了多個事件，我們可以使用onload事件監聽數據返回的情況，并在回調函數中對返回的數據進行處理。以下是一個簡單的例子。

xhr.onload = function() {
if (xhr.status === 200) {
// 數據請求成功
var response = JSON.parse(xhr.responseText);
// 對返回的數據進行處理
} else {
// 數據請求失敗
console.log("數據請求失敗：" + xhr.status);
}
};

最后，我們需要發送請求并獲取服務器的響應。使用XMLHttpRequest對象的send()方法來發送請求，可以傳入參數作為請求的內容。以下是一個發送GET請求的例子。

xhr.send();

以上就是使用Ajax進行數據傳輸的基本流程。通過這種方式，我們可以在不用刷新整個頁面的情況下，向服務器請求數據并將其更新到頁面上。

舉個例子，假設我們正在開發一個在線商城，我們希望在用戶搜索商品時通過Ajax實現實時的商品推薦功能。當用戶在搜索框中輸入關鍵字時，我們可以通過Ajax向服務器發送請求，獲取相匹配的商品數據，并動態地將推薦的商品顯示在頁面上。

在這個例子中，我們可以在用戶輸入關鍵字的時候，監聽input元素的input事件，并在事件觸發時發送Ajax請求。以下是一個簡化版的代碼示例。

var searchInput = document.getElementById("search-input");
var resultDiv = document.getElementById("result-div");
searchInput.addEventListener("input", function() {
var keyword = searchInput.value;
var xhr = new XMLHttpRequest();
xhr.open("GET", "https://api.example.com/search?keyword=" + keyword, true);
xhr.onload = function() {
if (xhr.status === 200) {
// 數據請求成功
var response = JSON.parse(xhr.responseText);
// 清空之前的推薦結果
resultDiv.innerHTML = "";
// 顯示推薦的商品
for (var i = 0; i< response.length; i++) {
var itemDiv = document.createElement("div");
itemDiv.innerText = response[i].name;
resultDiv.appendChild(itemDiv);
}
} else {
// 數據請求失敗
console.log("數據請求失敗：" + xhr.status);
}
};
xhr.send();
});

以上代碼中，我們首先獲取輸入框和結果顯示的元素，然后給輸入框添加input事件監聽器。每當用戶輸入時，我們就發送一個GET請求，請求包含用戶輸入的關鍵字。響應成功后，我們將返回的商品數據作為DOM節點添加到結果顯示的div中。這樣在用戶輸入過程中，我們可以實時根據關鍵字推薦相匹配的商品。

通過這個例子，我們可以看到Ajax技術在實現實時數據傳輸和動態更新頁面內容方面的強大能力。正是因為Ajax的應用，使得網頁可以更加快速、智能地響應用戶的操作，提升了用戶體驗。