AJAX是一種用于創建交互式網頁應用程序的技術，它使得網頁可以在不刷新整個頁面的情況下更新部分內容。通過AJAX，網頁可以異步加載數據并將其顯示給用戶，這大大提升了用戶體驗。本文將詳細解釋如何使用AJAX獲取JSON數據，并提供示例說明。

首先，讓我們來看一個簡單的例子。假設我們有一個包含國家和首都的JSON文件，我們想要通過AJAX獲取這些數據并在網頁上顯示。

<script>
// 發起AJAX請求
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
// 獲取JSON數據
var data = JSON.parse(this.responseText);
// 處理數據
var output = "";
for (var i = 0; i < data.length; i++) {
output += "<li>" + data[i].country + ": " + data[i].capital + "</li>";
}
// 在頁面上顯示數據
document.getElementById("output").innerHTML = output;
}
};
xhttp.open("GET", "countries.json", true);
xhttp.send();
</script>

在這個例子中，我們使用了XMLHttpRequest對象來發起AJAX請求。通過此對象的onreadystatechange事件，我們可以監聽請求的狀態變化，并在成功接收到響應時執行相應的操作。

在請求成功時，我們通過JSON.parse()函數將響應的文本轉換為可以操作的JSON對象。然后，我們可以使用該對象中的數據進行進一步的處理。

在這個例子中，我們遍歷JSON數據中的每個對象，并將國家和首都信息添加到一個HTML字符串中。最后，我們將這個字符串插入到一個具有id為“output”的元素中。

下面是一個示例的JSON文件“countries.json”的內容：

[
{
"country": "中國",
"capital": "北京"
},
{
"country": "美國",
"capital": "華盛頓特區"
},
{
"country": "英國",
"capital": "倫敦"
},
{
"country": "德國",
"capital": "柏林"
}
]

通過上述代碼，我們可以在網頁上顯示一個有序列表，其中包含每個國家及其首都：

<ul id="output"></ul>

總之，AJAX使得獲取和顯示JSON數據變得非常簡單。只需使用XMLHttpRequest對象發起請求，然后解析響應的JSON數據，并進行必要的處理和顯示即可。希望這個例子可以幫助您更好地理解如何使用AJAX獲取JSON數據。