AJAX（Asynchronous JavaScript and XML）是一種用于通過后臺服務器傳遞數據的技術，它允許通過異步通信從服務器獲取數據，而不需要刷新整個頁面。在AJAX中，我們可以通過給URL傳遞參數值來實現更多的功能和靈活性。本文將介紹如何使用AJAX給URL傳遞參數值，并通過舉例來說明其實際應用。

在AJAX中，我們可以通過在URL中添加參數來傳遞值。這些參數通常是鍵值對，其中鍵是參數的名稱，值是參數的值。下面的示例演示了如何通過AJAX給URL傳遞參數值：

function sendRequest() {
var parameter = document.getElementById("parameter").value;
var url = "https://example.com/api?param=" + parameter;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("response").innerHTML = this.responseText;
}
};
xhttp.open("GET", url, true);
xhttp.send();
}

在這個例子中，我們首先獲取了一個輸入框中的值，然后將其作為參數添加到URL中。當用戶點擊一個按鈕時，我們使用XMLHttpRequest對象創建一個HTTP GET請求，并將URL作為參數傳遞給open()方法。然后，我們通過send()方法將請求發送到服務器。一旦得到服務器的響應，我們將響應的文本設置為某個元素的內容。

通過給URL傳遞參數值，我們可以實現許多實際應用。例如，在一個電子商務網站中，當用戶搜索特定商品時，可以使用AJAX將搜索關鍵字作為參數傳遞給服務器，以獲取相應的商品列表。以下是一個簡化的例子：

function searchProducts() {
var keyword = document.getElementById("keyword").value;
var url = "https://example.com/api/search?keyword=" + keyword;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var products = JSON.parse(this.responseText);
displayProducts(products);
}
};
xhttp.open("GET", url, true);
xhttp.send();
}
function displayProducts(products) {
var productList = document.getElementById("product-list");
productList.innerHTML = "";
for (var i = 0; i < products.length; i++) {
var product = products[i];
var productName = product.name;
var productPrice = product.price;
var listItem = document.createElement("li");
listItem.innerHTML = productName + ": $" + productPrice;
productList.appendChild(listItem);
}
}

在這個例子中，我們獲取了用戶輸入的關鍵字，并將其作為參數添加到URL中。然后，我們發送一個HTTP GET請求，并將返回的商品列表作為JSON格式解析。最后，我們通過displayProducts函數將商品列表顯示在頁面上。

總的來說，AJAX給URL傳遞參數值是一個非常有用的功能，它可以用于各種場景下的數據傳遞和交互。通過給URL傳遞參數值，我們可以實現更加靈活和個性化的功能，為用戶提供更好的體驗。