在Ajax中,我们可以使用JavaScript的XMLHttpRequest对象来发送异步的HTTP请求。以下是一些常见的Ajax请求的例子:
- 使用原生的XMLHttpRequest对象发送GET请求:
var xhr = new XMLHttpRequest();
xhr.open("GET", "https://api.example.com/data", true);
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && xhr.status == 200) {
console.log(xhr.responseText);
}
};
xhr.send();
- 使用原生的XMLHttpRequest对象发送POST请求:
var xhr = new XMLHttpRequest();
xhr.open("POST", "https://api.example.com/data", true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && xhr.status == 200) {
console.log(xhr.responseText);
}
};
xhr.send("key1=value1&key2=value2");
- 使用JQuery的$.ajax方法发送GET请求:
$.ajax({
url: "https://api.example.com/data",
type: "GET",
dataType: "json",
success: function (response) {
console.log(response);
},
error: function (xhr, status, error) {
console.log("Error: " + error);
},
});
- 使用JQuery的$.ajax方法发送POST请求:
$.ajax({
url: "https://api.example.com/data",
type: "POST",
data: { key1: "value1", key2: "value2" },
dataType: "json",
success: function (response) {
console.log(response);
},
error: function (xhr, status, error) {
console.log("Error: " + error);
},
});
- 使用fetch API发送GET请求:
fetch("https://api.example.com/data")
.then(function (response) {
return response.json();
})
.then(function (myJson) {
console.log(myJson);
});
- 使用fetch API发送POST请求:
fetch("https://api.example.com/data", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({ key1: "value1", key2: "value2" }),
})
.then(function (response) {
return response.json();
})
.then(function (myJson) {
console.log(myJson);
});
以上代码都是在发送Ajax请求的时候处理常见的操作,比如设置请求头,设置请求体,设置请求的类型,设置请求的URL,以及处理请求成功和请求失败的情况。在实际的开发中,我们可以根据项目的需要和环境的限制来选择合适的方法来发送Ajax请求。