AJAX（Asynchronous JavaScript and XML）和JSON（JavaScript Object Notation）是兩個在前端開發中經常使用的技術。AJAX是一種使用JavaScript和XML來實現異步通信的技術，而JSON則是一種輕量級的數據格式，常用于數據交換。AJAX和JSON之間有著密切的聯系，通過AJAX可以使用JSON格式進行數據交互，提供了更加靈活和高效的方式來實現前后端數據的交流。

一種常見的使用AJAX和JSON的場景是在前端頁面中獲取后端返回的數據并進行展示。例如，在一個電商網站上，用戶在搜索框中輸入關鍵字，前端通過AJAX將輸入內容發送到后端，并使用JSON格式接收后端返回的搜索結果。前端可以解析JSON數據，提取所需要的信息，并將它們展示在頁面上。

$.ajax({
url: "search",
type: "POST",
dataType: "json",
data: {
keyword: "laptop"
},
success: function(response) {
// 解析JSON數據并展示在頁面上
var products = response.products;
products.forEach(function(product) {
$(".search-results").append("
" + product.name + "
");
});
}
});

在上述代碼中，AJAX通過發送POST請求到后端的 "search" 接口，并傳遞了搜索關鍵字為 "laptop"。后端處理請求后返回一個JSON格式的響應，包含了搜索結果的數據。前端通過指定dataType為"json"來告訴AJAX預期接收的數據類型為JSON。當AJAX成功獲取到響應時，success回調函數被觸發。在該回調函數中，前端解析JSON數據，并將每個產品的名稱顯示在頁面上。

除了從后端獲取數據，前端也可以通過AJAX將數據發送到后端進行處理。例如，在一個論壇網站上，用戶可以在頁面中發表評論。當用戶點擊提交按鈕時，前端通過AJAX將評論內容以JSON格式發送到后端進行保存。

$("#submit-comment").click(function() {
var comment = {
content: $("#comment-input").val(),
userId: currentUser.id
};
$.ajax({
url: "save-comment",
type: "POST",
dataType: "json",
data: JSON.stringify(comment),
success: function(response) {
// 處理后端返回的響應
}
});
});

在上述代碼中，前端通過點擊事件監聽到提交按鈕的點擊操作。當點擊事件發生時，前端通過jQuery選擇器獲取到評論輸入框中的內容，并從當前用戶對象中獲取到用戶ID。然后，前端將這些數據組裝成一個JSON對象，并使用JSON.stringify將其轉換為字符串。最后，前端通過AJAX將該JSON字符串發送到后端的 "save-comment" 接口，并在成功獲取到后端的響應后進行處理。

綜上所述，AJAX和JSON在前端開發中的關系密切。AJAX提供了一種實現異步通信的方式，而JSON則是一種常用的數據交換格式。通過AJAX，前端能夠使用JSON格式與后端進行數據交互，并實現頁面數據的動態更新和交互。這樣的組合極大地豐富了前端開發的方式，使得前端能夠更加靈活和高效地與后端進行數據交流。