AJAX（Asynchronous JavaScript and XML）是一種客戶端與服務器進行異步通信的技術。它可以使網頁實現部分更新，無需刷新整個頁面，大大提升了用戶體驗。在AJAX中，向服務器發送請求是一個非常關鍵的步驟。本文將介紹AJAX發送請求的6種方式，并通過豐富的示例來進行說明。

1. 使用原生JavaScript的XMLHttpRequest對象

var xhr = new XMLHttpRequest();
xhr.open('GET', 'example.com/data', true);
xhr.onreadystatechange = function(){
if(xhr.readyState === 4 && xhr.status === 200) {
var response = JSON.parse(xhr.responseText);
// 處理服務器返回的數據
}
}
xhr.send();

這種方式是AJAX最基本的方式，不依賴任何庫或框架。它發送一個GET請求到服務器，當服務器響應狀態為200時，即請求成功時，會調用回調函數對返回的數據進行處理。

2. 使用jQuery的$.ajax方法

$.ajax({
url: 'example.com/data',
method: 'GET',
success: function(response){
// 處理服務器返回的數據
}
});

jQuery是一款廣泛應用的JavaScript庫，它封裝了原生的XMLHttpRequest對象，使得發送AJAX請求更加簡單。上述代碼使用jQuery提供的$.ajax方法發送一個GET請求，并在請求成功后處理服務器返回的數據。

3. 使用Fetch API

fetch('example.com/data')
.then(function(response){
return response.json();
})
.then(function(data){
// 處理服務器返回的數據
});

Fetch API是瀏覽器提供的現代化的AJAX API，它使用Promise來處理異步操作。上述代碼使用fetch函數發送一個GET請求，并使用Promise鏈式調用處理服務器返回的數據。

4. 使用axios庫

axios.get('example.com/data')
.then(function(response){
// 處理服務器返回的數據
});

axios是一個流行的第三方庫，用于發送HTTP請求。它提供了簡潔易用的API，可以用于發送各種類型的請求。上述代碼使用axios庫的get方法發送一個GET請求，并在請求成功后處理服務器返回的數據。

5. 使用AngularJS的$http服務

$http.get('example.com/data')
.then(function(response){
// 處理服務器返回的數據
});

AngularJS是一款廣泛應用的JavaScript框架，它提供了許多服務和指令來簡化開發流程。$http是AngularJS提供的用于發送AJAX請求的服務。上述代碼使用$http服務的get方法發送一個GET請求，并在請求成功后處理服務器返回的數據。

6. 使用Vue.js的axios插件

axios.get('example.com/data')
.then(function(response){
// 處理服務器返回的數據
});

Vue.js是一款流行的JavaScript框架，用于構建用戶界面。Vue.js可以與第三方庫或插件進行無縫集成。axios是一款常用的AJAX庫，也可以用于Vue.js項目中。上述代碼使用Vue.js中的axios插件發送一個GET請求，并在請求成功后處理服務器返回的數據。

通過以上6種方式，我們可以輕松地實現AJAX請求，并在服務器響應成功后處理返回的數據。根據具體的使用場景和項目需求，選擇合適的方式來發送請求，對于提升用戶體驗和開發效率都非常有幫助。