在Web開發中，我們經常需要向服務器發送請求，并傳遞一些數據。使用傳統的方式，我們需要刷新整個頁面或者使用表單提交來完成這一過程。然而，這種方式會給用戶帶來不良體驗，因為頁面會重新加載或者跳轉，導致用戶失去當前正在瀏覽的信息。為了提升用戶體驗，Ajax（Asynchronous JavaScript and XML）應運而生。它通過在不刷新頁面的情況下與服務器進行數據交換，可以方便地向服務器傳值。

使用Ajax向服務器傳值的過程比較簡單。首先，我們需要創建一個XMLHttpRequest對象，該對象用于在后臺與服務器進行數據交互。然后，我們可以使用該對象的open方法來指定請求的類型（GET或POST）和URL。接著，我們可以使用send方法將數據發送到服務器。最后，我們通過監聽XMLHttpRequest對象的onreadystatechange事件來獲取服務器返回的響應。

舉個例子來說明。假設我們希望向服務器發送一個GET請求，并傳遞一個名為"username"的參數和對應的值"John"。首先，我們創建一個XMLHttpRequest對象：

var xhr = new XMLHttpRequest();

然后，我們使用open方法指定請求的類型和URL：

xhr.open("GET", "server.php?username=John", true);

接下來，我們發送請求：

xhr.send();

最后，我們通過監聽onreadystatechange事件來獲取服務器返回的響應：

xhr.onreadystatechange = function() {
if (xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {
console.log(xhr.responseText);
}
};

上述代碼中，我們在服務器返回響應的時候將響應輸出到控制臺。

除了GET請求外，我們還可以使用POST請求向服務器傳遞數據。不同于GET請求將數據附加在URL后面，POST請求將數據包含在請求體中。為了使用POST請求，我們需要將open方法的第一個參數改為"POST"，并將數據作為send方法的參數傳遞：

xhr.open("POST", "server.php", true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.send("username=John");

在上述代碼中，我們使用setRequestHeader方法設置請求頭，告訴服務器我們將發送的數據類型為"application/x-www-form-urlencoded"。然后，我們將數據作為send方法的參數傳遞。

需要注意的是，由于Ajax請求是異步的，所以我們需要使用回調函數來處理服務器的響應。上述例子中，我們使用了onreadystatechange事件來監聽XMLHttpRequest對象的狀態變化。當狀態變為4（表示請求已完成）且狀態碼為200（表示請求成功）時，我們將服務器返回的響應輸出到控制臺。

綜上所述，使用Ajax向服務器傳值是一種方便、高效的方式。它不僅可以避免頁面重新加載或跳轉，提升用戶體驗，還可以在后臺與服務器進行數據交互。無論是GET請求還是POST請求，我們都可以通過創建XMLHttpRequest對象、指定請求類型和URL、發送請求以及處理服務器響應來完成數據傳遞。通過靈活運用Ajax，我們可以打造更加交互性強、用戶體驗優秀的Web應用。