JQuery实现AJAX
我们可以使用AJAX做些什么?
- 不刷新页面更新网页
- 在页面加载后从服务器请求数据
- 在页面加载后从服务器接收数据
- 在后台向服务器发送数据
json是Ajax发送小部分数据的一种轻量级数据格式,可以简单易懂的给服务器或浏览器交互数据,包括json对象,json数组对象。
JQuery库中已经封装了ajax请求的方法。
示例:
$(function() {
//请求参数
let params = {}
//ajax
$.ajax({
//请求方法,get或者post,默认是get
type: "post",
//预期服务器返回的数据类型
dataType:"json",
//内容编码类型
contentType: "application/json;charset=UTF-8",
//发送请求的地址(默认为当前页面)
url: "http://localhost:8080/admin/dashboard",
//发动到服务器的数据,要求是string或者Object类型,get请求中将附加在url后
data: JSON.stringify(params),
//默认为true,所有请求均为异步,设置为false则为同步请求
async: "false",
//设置为 false 将不会从浏览器缓存中加载请求信息。
cache: "true",
success: function (data, textStatus) {
console.log("请求成功后调用的回调函数")
console.log(data + "→服务器返回数据")
console.log(textStatus + "→服务器返回状态")
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
console.log(XMLHttpRequest + "→XMLHttpRequest对象")
console.log(textStatus + "→错误信息")
console.log(errorThrown + "→(可能)捕获的错误对象")
console.log("请求失败时被调用的函数")},
complete: function (XMLHttpRequest, textStatus) {
console.log(XMLHttpRequest + "→XMLHttpRequest对象")
console.log(textStatus + "→信息字符串")
console.log("请求完成后调用的回调函数(请求成功或失败时均调用)")
}
})
})