AJAX 和 JSON 是現代 web 開發中重要的技術，它們可以幫助我們實現更加動態、交互性強的網頁。AJAX（Asynchronous JavaScript and XML）是一種用于創建快速、動態加載內容的技術，而 JSON（JavaScript Object Notation）則是一種用于發送和接收數據的輕量級格式。

在過去，當我們訪問網頁時，通常會發起新的 HTTP 請求來獲取新的頁面內容。這樣的方式在用戶體驗上有一定的延遲和不便。而使用 AJAX 技術，我們可以在不刷新整個頁面的情況下，向服務器發送請求并獲取數據，然后將這些數據動態地插入到當前頁面中。這樣可以使用戶感覺到頁面的更新變得更加迅速，無需等待整頁刷新。

舉一個簡單的例子來說明，假設我們正在開發一個天氣預報應用。傳統的方式是用戶訪問頁面后，通過填寫表單或選擇城市來獲取該城市的天氣信息。而使用 AJAX，我們可以在用戶輸入城市名后，實時地向服務器發送請求并獲取天氣數據，然后將這些數據通過 JSON 格式發送給前端頁面進行展示。這種方式可以讓用戶在不刷新頁面的情況下迅速獲取天氣信息，提供了更好的用戶體驗。

$.ajax({
url: "weather.php",
data: { city: "Shanghai" },
dataType: "json",
success: function(response) {
// 處理服務器返回的 JSON 數據
var temperature = response.temperature;
var weather = response.weather;
$("#temperature").text(temperature);
$("#weather").text(weather);
}
});

同時，JSON 也起到了重要的角色。它是一種輕量級數據交換格式，易于閱讀和編寫，并且在各種編程語言間具有通用性。JSON 使用鍵值對的方式存儲數據，非常適合在 AJAX 請求中發送和接收數據。

舉個例子來說明，假設我們在前端頁面中需要發送一個包含用戶信息的請求，例如用戶的姓名、年齡和所在城市，我們可以使用 JSON 格式來封裝這些數據，并將其發送給服務器端進行處理。

var user = {
name: "John Doe",
age: 30,
city: "New York"
};
$.ajax({
url: "save_user.php",
data: JSON.stringify(user),
contentType: "application/json",
success: function(response) {
// 處理服務器返回的響應
console.log(response);
}
});

在這個例子中，我們使用 JSON.stringify() 方法將 JavaScript 對象轉換為 JSON 格式的字符串，并通過 AJAX 請求發送給服務器后端。服務器接收到這個 JSON 數據，并根據需要進行解析和處理。

AJAX 和 JSON 的組合在現代 web 開發中扮演著重要的角色，它們使得我們可以更加靈活和高效地與服務器進行數據交互。無論是動態更新網頁內容，還是發送和接收數據，這一組合都可以滿足我們的需求，并為用戶提供更好的體驗。