一、ajax原理
1.创建ajax对象
2.打开链接
3.发送请求
4.接收响应
ajax的核心: XMLHttpRequest
二、GET
创建ajax对象
不兼容IE6
var oAjax = new XMLHttpRequest();
IE678
var oAjax = new ActiveXObject('Microsoft.XMLHTTP');
兼容写法
if(window.XMLHttpRequest){
var oAjax = new XMLHttpRequest();
}else{
var oAjax = new ActiveXObject('Microsoft.XMLHTTP');
}
打开链接
oAjax.open('打开方式','url?data',是否异步);
同步
一次只能做一件事
异步
同时做多件事
oAjax.open('GET','xxx?xxx=xxx',true);
发送请求
oAjax.send();
接收响应
oAjax.onreadystatechange = function(){
判断ajax状态码
if(oAjax.readyState==4){
判断http状态码
if(oAjax.status>=200&&oAjax.status<300||oAjax.status==304){
成功
oAjax.responseText
响应文本
}else{
失败
}
}
}
三、POST
创建ajax对象
不兼容IE6
var oAjax = new XMLHttpRequest();
IE678
var oAjax = new ActiveXObject('Microsoft.XMLHTTP');
兼容写法
if(window.XMLHttpRequest){
var oAjax = new XMLHttpRequest();
}else{
var oAjax = new ActiveXObject('Microsoft.XMLHTTP');
}
打开链接
oAjax.open('打开方式','url?data',是否异步);
同步
一次只能做一件事
异步
同时做多件事
oAjax.open('POST','url',true);
设置请求头部
oAjax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
发送请求
oAjax.send(data);
接收响应
oAjax.onreadystatechange = function(){
判断ajax状态码
if(oAjax.readyState==4){
判断http状态码
if(oAjax.status>=200&&oAjax.status<300||oAjax.status==304){
成功
oAjax.responseText
响应文本
}else{
失败
}
}
}
四、ajax状态码
0 准备成功,未发送
1 发送成功
2 接收原始数据成功1
3 解析数据成功
4 完成
五、HTTP状态码
http状态码是3位数
2字头代表成功
304 重定向(Not Modify)