AJAX是一種在網(wǎng)頁中動態(tài)更新內(nèi)容的技術(shù)。它能夠通過異步交互的方式，實現(xiàn)在頁面上獲取和顯示數(shù)據(jù)，而不需要刷新整個頁面。其中，通過使用AJAX來獲取文本框中的值，可以使用戶輸入的內(nèi)容實時地傳遞給服務(wù)器，實現(xiàn)即時的數(shù)據(jù)交互和更新。本文將以一個簡單的例子來介紹如何使用AJAX來獲取文本框的值。

假設(shè)我們有一個表單，其中包含一個文本框和一個按鈕。用戶在文本框中輸入內(nèi)容后，點擊按鈕，我們希望能夠獲取到文本框中的值，并將其發(fā)送給服務(wù)器。通過使用AJAX，我們可以在不刷新頁面的情況下，將文本框中的值發(fā)送給服務(wù)器，然后獲取服務(wù)器返回的數(shù)據(jù)，并在頁面上進行展示。

// HTML代碼
<form>
<input type="text" id="myInput" placeholder="請輸入內(nèi)容" />
<button id="myButton">提交</button>
</form>

// Javascript代碼
document.getElementById("myButton").addEventListener("click", function() {
var inputValue = document.getElementById("myInput").value;  // 獲取文本框的值
var xhr = new XMLHttpRequest();
xhr.open("POST", "server.php", true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.onreadystatechange = function() {
if(xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {
var response = xhr.responseText;  // 獲取服務(wù)器返回的數(shù)據(jù)
// 在頁面上展示服務(wù)器返回的數(shù)據(jù)
document.getElementById("output").innerHTML = response;
}
};
xhr.send("inputValue=" + inputValue);  // 向服務(wù)器發(fā)送數(shù)據(jù)
});

在上述代碼中，我們首先通過使用addEventListener給按鈕添加了一個點擊事件的監(jiān)聽器。當(dāng)按鈕被點擊時，代碼會獲取到文本框中的值，并將其存儲在元素的value屬性中。

之后，我們創(chuàng)建了一個XMLHttpRequest對象來實現(xiàn)異步的數(shù)據(jù)傳輸。通過調(diào)用open方法，我們設(shè)置了請求的方法、URL和是否異步。接著，通過調(diào)用setRequestHeader方法，我們設(shè)置了請求頭的Content-Type屬性為"application/x-www-form-urlencoded"，這是一種常用的格式用來傳遞表單數(shù)據(jù)。

然后，我們設(shè)置了onreadystatechange事件的回調(diào)函數(shù)。當(dāng)xhr對象的readyState屬性值發(fā)生變化時，該回調(diào)函數(shù)會被調(diào)用。在回調(diào)函數(shù)中，我們檢查了xhr對象的readyState和status。如果readyState的值為XMLHttpRequest.DONE(4)，并且status的值為200，表示服務(wù)器已經(jīng)成功處理了請求。這時，我們可以通過調(diào)用xhr對象的responseText屬性來獲取到服務(wù)器返回的數(shù)據(jù)。

最后，我們將服務(wù)器返回的數(shù)據(jù)展示在頁面上。在HTML代碼中，我們使用<output>標(biāo)簽來展示服務(wù)器返回的數(shù)據(jù)。

總的來說，通過使用AJAX來獲取文本框的值，我們可以在不刷新整個頁面的情況下，實時地將用戶輸入的內(nèi)容發(fā)送給服務(wù)器，并獲取服務(wù)器返回的數(shù)據(jù)進行展示。這種方式能夠極大地提升用戶體驗，同時也方便了數(shù)據(jù)的交互和更新。