本文將介紹如何使用Ajax獲取層級JSON數據，并提供一些具體的實例來加深理解。Ajax是一種強大的技術，可以從服務器上異步加載數據，而不必刷新整個頁面。在很多Web應用程序中，我們常常需要獲取JSON格式的數據，并對其進行處理和展示。

層級JSON是一種嵌套層級結構的JSON數據。它可以包含多個嵌套的對象和數組，以便更好地組織和描述數據。假設我們有一個城市列表的層級JSON數據，如下所示：

{
"cities": [
{
"name": "北京",
"population": 21540000,
"districts": [
{"name": "東城區"},
{"name": "西城區"},
{"name": "朝陽區"},
{"name": "海淀區"}
]
},
{
"name": "上海",
"population": 24240000,
"districts": [
{"name": "黃浦區"},
{"name": "徐匯區"},
{"name": "靜安區"},
{"name": "虹口區"}
]
}
]
}

假設我們想要使用Ajax從服務器獲取并顯示這個城市列表。以下是步驟：

1. 使用Ajax請求獲取JSON數據。
2. 解析JSON數據。
3. 將數據顯示在網頁上。

首先，我們使用Ajax發送HTTP請求獲取JSON數據：

var xhr = new XMLHttpRequest();
xhr.open("GET", "cities.json", true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var data = JSON.parse(xhr.responseText);
// 在這里處理數據
}
};
xhr.send();

在上面的代碼中，我們使用XMLHttpRequest對象創建了一個異步HTTP請求。我們使用open()方法指定請求的類型、URL和是否進行異步處理。然后，我們通過onreadystatechange事件處理程序來接收和處理服務器的響應。我們檢查readyState屬性和status屬性，以確保請求已完成并且服務器返回了正確的狀態碼。如果一切順利，我們使用JSON.parse()函數將返回的JSON字符串解析為JavaScript對象。

現在，我們已經成功獲取并解析了JSON數據，接下來我們可以將數據顯示在網頁上。以下是一個簡單的例子：

var citiesElement = document.getElementById("cities");
data.cities.forEach(function(city) {
var cityElement = document.createElement("div");
cityElement.innerHTML = "城市：" + city.name;
citiesElement.appendChild(cityElement);
var districtsElement = document.createElement("ul");
city.districts.forEach(function(district) {
var districtElement = document.createElement("li");
districtElement.innerHTML = "行政區：" + district.name;
districtsElement.appendChild(districtElement);
});
citiesElement.appendChild(districtsElement);
});

在上面的代碼中，我們首先通過getElementById()方法獲取了包含城市列表的容器元素。然后，我們使用forEach()方法遍歷JSON數據中的每個城市對象。對于每個城市，我們創建一個