AJAX（Asynchronous JavaScript and XML）是一種使用JavaScript和XML進(jìn)行通信的技術(shù)，它可以在不用刷新整個(gè)頁面的情況下，實(shí)現(xiàn)與服務(wù)器的異步數(shù)據(jù)傳輸。通過AJAX，我們可以實(shí)現(xiàn)向后臺服務(wù)器添加數(shù)據(jù)的功能，使得用戶能夠在不離開當(dāng)前頁面的情況下提交數(shù)據(jù)并立即看到結(jié)果。

假設(shè)我們有一個(gè)簡單的網(wǎng)頁，其中包含一個(gè)表單，用戶可以在表單中輸入一些信息，并點(diǎn)擊提交按鈕將這些信息發(fā)送到服務(wù)器保存。傳統(tǒng)的方式是將整個(gè)頁面重新加載，這樣做會使用戶體驗(yàn)變差，因?yàn)轫撁嬷匦录虞d需要時(shí)間，而且用戶需要重新輸入之前的數(shù)據(jù)。使用AJAX，則可以在不刷新整個(gè)頁面的情況下，將用戶的輸入數(shù)據(jù)發(fā)送給服務(wù)器。

下面是一個(gè)使用AJAX實(shí)現(xiàn)添加數(shù)據(jù)的示例：

// HTML部分，一個(gè)簡單的表單
<form id="myForm">
<input type="text" id="name" placeholder="請輸入姓名">
<input type="text" id="email" placeholder="請輸入郵箱">
<button id="submitBtn" type="button" onclick="addData()">提交</button>
</form>

// JavaScript部分，使用AJAX發(fā)送數(shù)據(jù)到服務(wù)器
function addData() {
var name = document.getElementById("name").value;
var email = document.getElementById("email").value;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
// 數(shù)據(jù)添加成功的處理邏輯
console.log("數(shù)據(jù)添加成功！");
}
};
// 向服務(wù)器發(fā)送POST請求，將數(shù)據(jù)作為參數(shù)傳遞
xhttp.open("POST", "add_data.php", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("name=" + name + "&email=" + email);
}

在上面的示例中，用戶填寫完表單后，點(diǎn)擊提交按鈕會調(diào)用addData()函數(shù)。這個(gè)函數(shù)首先獲取表單中的姓名和郵箱輸入框的值，并創(chuàng)建一個(gè)XMLHttpRequest對象xhttp。然后，通過設(shè)置xhttp的onreadystatechange屬性，當(dāng)服務(wù)器的響應(yīng)狀態(tài)改變時(shí)，會自動執(zhí)行一個(gè)函數(shù)。

在這個(gè)函數(shù)中，首先檢查響應(yīng)狀態(tài)是否為4（表示服務(wù)器已經(jīng)返回所有數(shù)據(jù)），以及響應(yīng)的HTTP狀態(tài)碼是否為200（表示請求成功）。如果滿足這兩個(gè)條件，就可以執(zhí)行數(shù)據(jù)添加成功的處理邏輯，這里只是簡單打印了一個(gè)成功信息。

最后，使用xhttp.open()方法打開一個(gè)與服務(wù)器的連接，并使用xhttp.send()方法發(fā)送POST請求，將表單中的數(shù)據(jù)作為參數(shù)傳遞給服務(wù)器。在發(fā)送請求之前，還需要設(shè)置請求頭的Content-type屬性為application/x-www-form-urlencoded，保證數(shù)據(jù)以表單形式進(jìn)行傳輸。

總結(jié)起來，使用AJAX實(shí)現(xiàn)添加數(shù)據(jù)的過程可以概括為：首先獲取用戶輸入的數(shù)據(jù)，然后創(chuàng)建XMLHttpRequest對象，設(shè)置回調(diào)函數(shù)，在回調(diào)函數(shù)中處理服務(wù)器的響應(yīng)結(jié)果，最后發(fā)送請求并傳遞數(shù)據(jù)到服務(wù)器。通過這樣的方式，用戶在填寫完表單后可以立即看到數(shù)據(jù)添加成功的反饋，而不需要等待整個(gè)頁面的重新加載。