Ajax（Asynchronous Javascript and XML）是一種用于在不刷新整個頁面的情況下，通過異步請求和回傳數據來更新部分頁面內容的技術。在使用Ajax時，經常需要將回傳的值賦值給相應的元素或變量。本文將介紹如何使用Ajax回傳的值，并通過舉例說明其應用。 在開發中，一個常見的場景是通過輸入關鍵字來實現實時搜索功能。當用戶在搜索框中輸入關鍵字時，頁面無需刷新即可顯示匹配結果。這時，可以通過Ajax來實現這一功能。當用戶輸入關鍵字時，Ajax會發送異步請求到服務器，并將服務器返回的數據賦值給相應的元素。 例如，假設我們有一個搜索框和一個搜索結果顯示區域。當用戶輸入關鍵字時，我們想要通過Ajax將匹配的結果顯示在搜索結果區域里。我們可以通過以下方式實現： ```html``` ```javascript let searchInput = document.getElementById('searchInput'); let searchResults = document.getElementById('searchResults'); searchInput.addEventListener('input', function() { let keyword = searchInput.value; let xhr = new XMLHttpRequest(); xhr.onreadystatechange = function() { if (xhr.readyState === 4 && xhr.status === 200) { let results = JSON.parse(xhr.responseText); searchResults.innerHTML = results; } }; xhr.open('GET', 'search.php?keyword=' + keyword, true); xhr.send(); }); ``` 在上述代碼中，我們首先獲取了搜索框和搜索結果的元素。然后，給搜索框添加了一個input事件監聽器。當用戶在搜索框中輸入時，事件監聽器會被觸發，獲取輸入的關鍵字并將其賦值給變量`keyword`。接下來，創建了一個XMLHttpRequest對象，并定義了其`onreadystatechange`事件處理函數。當異步請求的狀態發生變化時，事件處理函數會獲取服務器返回的數據并將其解析為JSON格式，最后將匹配結果賦值給搜索結果區域的內部HTML。 除了上述例子中的實時搜索功能，Ajax回傳的值可以在許多其他場景中使用。例如，在一個用戶評論功能中，用戶可以通過Ajax提交評論，并將評論列表更新為最新的評論。在購物網站中，用戶可以通過Ajax將商品添加到購物車，同時更新購物車數量和總價。 在任何使用Ajax回傳值并賦值的情況中，我們需要注意以下幾點： 1. 通過Ajax發送請求并接收回傳值需要使用XMLHttpRequest或更高級的fetch API； 2. 服務器返回的數據通常是字符串格式，我們需要根據實際情況進行解析和處理，可以是JSON、HTML或其他格式； 3. 將回傳值賦值給相關元素或變量時，要確保目標元素或變量已經在頁面中存在，并且可以通過DOM操作獲取到。 總之，使用Ajax回傳值賦值是一種常見而重要的技術，可以為頁面增加動態效果，并提升用戶體驗。通過異步請求和回傳的值，我們可以實現各種功能，如實時搜索、評論更新、購物車更新等等。掌握這一技術，將有助于我們開發更加交互性和豐富的Web應用程序。