在網頁開發過程中，我們經常需要與后臺進行數據交互，獲取后臺傳過來的值。這時候，我們可以使用Ajax技術來實現無需刷新頁面即可接收后臺傳過來的值。無論是獲取用戶的登錄狀態、購物車中的商品數量還是加載更多的文章列表，Ajax都可以幫助我們實現這些功能。

以一個簡單的示例來說明，我們有一個網頁上的按鈕，當點擊按鈕時，通過Ajax從后臺獲取一條隨機的名言，并將其顯示在網頁上。假設后臺返回的數據是一個JSON格式的字符串，包含名言的內容和作者。我們可以通過以下代碼來實現：

var button = document.getElementById('button');
button.onclick = function() {
var xhr = new XMLHttpRequest();
xhr.onload = function() {
if (xhr.status === 200) {
var quote = JSON.parse(xhr.responseText);
var quoteContent = quote.content;
var quoteAuthor = quote.author;
var quoteElement = document.createElement('p');
quoteElement.textContent = '“' + quoteContent + '” - ' + quoteAuthor;
document.body.appendChild(quoteElement);
}
};
xhr.open('GET', 'quote.php', true);
xhr.send();
};

這段代碼中，我們首先通過getElementById方法獲取到按鈕元素，然后給按鈕添加了一個點擊事件監聽器。當按鈕被點擊時，會執行監聽器中的代碼。

我們創建了一個XMLHttpRequest對象，它可以用于發送HTTP請求。我們給xhr對象的onload屬性添加了一個函數，當后臺返回數據成功時會執行這個函數。

在這個函數中，我們首先檢查xhr對象的status屬性是否等于200，這表示HTTP請求成功。如果成功，我們通過JSON.parse方法將服務器返回的JSON字符串轉換為一個JavaScript對象。

然后，我們從這個對象中提取名言的內容和作者。我們創建一個p元素，將名言和作者填充到這個元素中，并將它添加到網頁的body中。這樣，當我們點擊按鈕時，就會在網頁中顯示一條隨機的名言。

除了獲取名言，我們還可以通過Ajax來實現其他的功能。比如，我們可以獲取用戶的購物車中的商品數量，并將其顯示在頁面上。假設后臺返回的數據是一個整數，表示購物車中商品的數量。我們可以通過以下代碼來實現：

var cartCount = document.getElementById('cartCount');
function getCartCount() {
var xhr = new XMLHttpRequest();
xhr.onload = function() {
if (xhr.status === 200) {
var count = parseInt(xhr.responseText);
cartCount.textContent = count;
}
};
xhr.open('GET', 'cart.php', true);
xhr.send();
}
getCartCount();

在這段代碼中，我們定義了一個函數getCartCount。函數中的代碼和之前的示例類似，不同的是，我們沒有給按鈕添加點擊事件監聽器，而是在頁面加載完成后直接調用了這個函數。

在函數中，我們發送了一個HTTP GET請求給后臺的cart.php頁面。當請求被成功處理時，后臺會返回一個表示購物車內商品數量的整數。我們將這個整數轉換為數字，并將其填充到一個指定的HTML元素中，這個元素的id是cartCount。這樣，當頁面加載完成后，我們就可以直接看到購物車中的商品數量。

通過以上示例，我們可以看到，使用Ajax可以實現無需刷新頁面即可接收后臺傳過來的值。無論是顯示名言、獲取購物車中的商品數量還是加載更多的文章列表，Ajax幫助我們實現了這些功能，讓網頁交互更加流暢和友好。