AJAX（Asynchronous JavaScript and XML） 是一種用于在不刷新整個頁面的情況下從服務器獲取數(shù)據(jù)的技術。它通過在后臺與服務器進行異步數(shù)據(jù)交互，能夠在不干擾用戶當前操作的情況下更新頁面。其中，獲取 JSON 文本數(shù)據(jù)是 AJAX 最常見的用例之一。本文將介紹如何使用 AJAX 獲取 JSON 文本數(shù)據(jù)，并給出一些實際的例子。

使用 AJAX 獲取 JSON 數(shù)據(jù)非常簡單。首先，我們需要創(chuàng)建一個 XMLHttpRequest 對象，用于發(fā)送請求和接收響應。然后，我們使用該對象的 open() 方法指定請求的類型（GET 或 POST）和需要獲取的數(shù)據(jù)的 URL。接下來，我們可以通過設置響應的數(shù)據(jù)類型為 JSON，以確保響應會以 JSON 格式返回。最后，我們發(fā)送請求并在接收到響應后對其進行處理。

var xhr = new XMLHttpRequest();
xhr.open('GET', 'data.json', true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.responseType = 'json';
xhr.onload = function() {
if (xhr.status === 200) {
var data = xhr.response;
// 對返回的 JSON 數(shù)據(jù)進行處理
}
};
xhr.send();

以上代碼展示了如何使用 XMLHttpRequest 對象來獲取一個名為 data.json 的 JSON 文本文件。其中，我們使用 open() 方法指定了請求的方法為 GET，請求的 URL 為 data.json。接下來，我們通過 setRequestHeader() 方法設置請求的內容類型為 application/json，確保服務器返回的響應為 JSON 格式。然后，我們設置了響應的數(shù)據(jù)類型為 json，這將告訴瀏覽器將響應解析為 JSON 對象。最后，在接收到響應并且響應狀態(tài)碼為 200 時，我們可以通過 xhr.response 屬性來訪問到返回的 JSON 數(shù)據(jù)，并進行后續(xù)處理。

下面，讓我們來看一個實際的例子。假設我們有一個電商網(wǎng)站，需要從服務器獲取一些商品的信息并在頁面上進行展示。我們可以通過 AJAX 來獲取一個包含商品信息的 JSON 文件，并使用 JavaScript 將該信息展示在頁面上。以下是一個簡化版的例子：

var xhr = new XMLHttpRequest();
xhr.open('GET', 'products.json', true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.responseType = 'json';
xhr.onload = function() {
if (xhr.status === 200) {
var products = xhr.response;
var productContainer = document.getElementById('product-container');
products.forEach(function(product) {
var productElement = document.createElement('div');
productElement.className = 'product';
var nameElement = document.createElement('h3');
nameElement.textContent = product.name;
var priceElement = document.createElement('p');
priceElement.textContent = 'Price: ' + product.price;
productElement.appendChild(nameElement);
productElement.appendChild(priceElement);
productContainer.appendChild(productElement);
});
}
};
xhr.send();

以上代碼演示了如何使用 AJAX 獲取一個包含商品信息的 JSON 文件（products.json），并將商品信息展示在頁面上。我們首先創(chuàng)建了一個 XMLHttpRequest 對象，打開了一個 GET 請求，并指定了請求的 URL 為 products.json。然后，我們設置了請求的內容類型為 application/json，并將響應的數(shù)據(jù)類型設置為 json。在接收到響應并且響應狀態(tài)碼為 200 時，我們使用 xhr.response 屬性來訪問到返回的 JSON 數(shù)據(jù)，并遍歷該數(shù)據(jù)以創(chuàng)建相應的 HTML 元素。最后，我們將創(chuàng)建好的商品元素添加到頁面上的一個容器中。

通過以上的例子，我們可以看到 AJAX 獲取 JSON 文本數(shù)據(jù)的基本步驟。首先，我們需要創(chuàng)建一個 XMLHttpRequest 對象并發(fā)送請求。其次，我們需要在服務器返回的響應中確保數(shù)據(jù)的格式為 JSON。最后，我們可以通過訪問響應的屬性來獲取并處理返回的 JSON 數(shù)據(jù)。無論是展示商品信息還是獲取其他類型的數(shù)據(jù)，AJAX 加載 JSON 文本數(shù)據(jù)的原理都是相同的。

AJAX 的出現(xiàn)極大地簡化了 Web 開發(fā)中數(shù)據(jù)交互的過程，并為我們提供了許多強大的功能。無論是獲取 JSON 數(shù)據(jù)、發(fā)送表單數(shù)據(jù)還是進行動態(tài)數(shù)據(jù)更新，AJAX 都是不可或缺的一部分。