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请求，并在服务器响应成功后处理返回的数据。根据具体的使用场景和项目需求，选择合适的方式来发送请求，对于提升用户体验和开发效率都非常有帮助。