在現代web應用程序中，使用Ajax（Asynchronous JavaScript and XML）和JSON（JavaScript Object Notation）進行數據交互變得越來越常見。Ajax允許在不刷新整個頁面的情況下與服務器進行數據交換，而JSON則是一種輕量級的數據格式，易于解析和生成。通過結合Ajax和JSON，開發人員可以創建出高效、靈活且具有良好用戶體驗的web應用程序。

一個常見的例子是，在一個網頁上顯示實時的天氣信息。假設我們有一個天氣API，可以提供指定城市的天氣預報。我們可以使用Ajax在用戶輸入城市的同時向服務器發送請求，并使用JSON格式接收響應。這樣，我們可以動態更新網頁上的天氣信息，而不需要整個頁面進行刷新。

$.ajax({
url: "https://api.weather.com/forecast",
method: "GET",
data: {
city: userInput
},
success: function(response) {
// 處理服務器返回的JSON數據
var weatherData = JSON.parse(response);
// 更新網頁上的天氣信息
$("#weather").text(weatherData.weather);
$("#temperature").text(weatherData.temperature);
$("#humidity").text(weatherData.humidity);
}
});

上述代碼中，我們使用jQuery的$.ajax函數發送了一個GET請求到指定的URL，并傳遞了用戶輸入的城市作為參數。在成功接收到服務器的響應后，我們將返回的JSON字符串解析為一個JavaScript對象，并使用其中的數據更新了網頁上的天氣信息。

Ajax和JSON的結合還可以應用于更復雜的場景中，如使用自動補全功能。假設我們有一個存儲了用戶信息的數據庫，用戶可以在一個搜索框中輸入姓名的一部分，并在輸入過程中顯示匹配的用戶姓名。我們可以使用Ajax向服務器發送每次用戶輸入的請求，并將匹配的用戶數據作為JSON格式返回。

$("#searchInput").on("input", function() {
var searchTerm = $(this).val();
$.ajax({
url: "https://api.example.com/search",
method: "GET",
data: {
term: searchTerm
},
success: function(response) {
// 處理服務器返回的JSON數據
var searchData = JSON.parse(response);
// 在搜索結果列表中顯示匹配的用戶姓名
$("#searchResults").empty();
searchData.forEach(function(result) {
$("#searchResults").append("
" + result.name + "
");
});
}
});
});

在上述例子中，我們使用jQuery的on方法監聽輸入框的input事件。每當用戶輸入內容時，我們發送一個GET請求到服務器，并將用戶輸入作為參數。服務器返回的JSON數據包含了與輸入內容匹配的用戶信息。我們解析這個數據，并使用其中的姓名字段來動態更新搜索結果列表。

總之，Ajax和JSON的結合可以用于各種web應用程序中，從簡單的實時天氣更新到復雜的自動補全功能。通過異步加載數據并使用JSON格式進行交換，我們可以創建出高度交互且具有良好用戶體驗的web應用程序。