在現代的web開發中，Ajax（Asynchronous JavaScript and XML）技術已經成為不可或缺的一部分。通過使用Ajax，網頁可以在不刷新的情況下與服務器進行通信，獲取數據并動態地更新內容。而在Ajax中，通過發送HTTP 1.1請求來與服務器進行交互是一種常見的方式。本文將介紹如何使用Ajax發送HTTP 1.1請求，并通過實際的例子來說明其應用場景和優勢。

首先，讓我們來看一個簡單的示例，展示了如何使用Ajax發送HTTP 1.1請求來獲取服務器上的數據并動態地更新頁面內容。假設我們有一個簡單的網頁，其中包含一個按鈕和一個用來顯示數據的容器：

<button onclick="loadData()">點擊加載數據</button>
<div id="dataContainer"></div>

在JavaScript中，我們可以使用XMLHttpRequest對象來發送HTTP請求，并通過該對象的回調函數來處理服務器響應。下面是一個發送GET請求的示例代碼：

function loadData() {
var xhr = new XMLHttpRequest();
xhr.open("GET", "https://example.com/api/data", true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var responseData = JSON.parse(xhr.responseText);
document.getElementById("dataContainer").innerHTML = responseData;
}
};
xhr.send();
}

在上述代碼中，我們首先創建了一個XMLHttpRequest對象，并使用open方法指定了請求的方法（GET）、請求的URL（https://example.com/api/data）以及請求是否是異步的（true）。然后，我們通過指定onreadystatechange回調函數來處理服務器響應。當readyState的值等于4，而且status的值等于200時，表示服務器響應成功，我們可以獲取服務器返回的數據并更新頁面內容。

除了GET請求，我們還可以使用Ajax來發送其他類型的HTTP請求，如POST、PUT和DELETE。下面是一個發送POST請求的示例代碼：

function sendData() {
var xhr = new XMLHttpRequest();
xhr.open("POST", "https://example.com/api/data", true);
xhr.setRequestHeader("Content-Type", "application/json");
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var responseData = JSON.parse(xhr.responseText);
document.getElementById("dataContainer").innerHTML = responseData;
}
};
var requestData = {
username: "John",
password: "12345"
};
xhr.send(JSON.stringify(requestData));
}

在上述代碼中，我們通過設置setRequestHeader方法來指定請求頭的Content-Type為application/json，表示我們將發送JSON格式的數據。然后，我們將需要發送的數據以字符串的形式通過send方法發送給服務器。

總結來說，通過使用Ajax發送HTTP 1.1請求，我們可以在不刷新頁面的情況下與服務器進行交互，獲取數據并動態地更新頁面內容。這為開發者提供了更好的用戶體驗和性能優化的機會，使得web應用程序更加靈活和高效。