ajax:异步 的 javascript and xml
ajax作用: 主要是用于数据交互使用的
ajax的原理: 通过XMLHTTPRequest对象 向服务器发送异步请求, 从而从服务器获取数据,然后使用js来操作DOM而更新页面
ajax的核心: 就是js 中的 XMLHTTPRequest对象
特点:异步加载 局部更新
ajax给我们带来的好处:1.页面无刷新,页面与服务器通信时,提高用户的体验
1. 创建 XMLHTTPRequest对象---->用于向服务器端交换数据,相当于创建了一个http请求的一个对象------------------打开浏览器
var xhr = new XMLHttpRequest();
2. 规定请求的类型(get,post),url地址,以及是否异步,默认异步------------在地址栏输入网址信息
xhr.open('get', 'test.txt');
3. 发送请求到服务器------------回车
xhr.send();
4. 等待响应-----因为不知道服务器什么时候才能返回我们需要的数据,要采用事件的机制去触发
xhr.onreadystatechange = function () {
// console.log(111);
console.log(this.readyState);//状态改变时触发, 2,3,4
//如果响应已经就绪,就可以获取响应后的数据
if (this.readyState == 4) {
//获取响应的文本
console.log(this.responseText);
}
}
$.ajax({
type:'请求的类型',
url:'请求的地址',
data:'要发送到服务器的数据',
dataType:'要求服务器端返回的数据类型',
success:function(){请求成功的回调函数},
error:function(){失败}
complete:function(){请求完成后执行,不管是否请求成功}
async:是否异步,bool,默认异步
});