初识AJAX
一、HTTP协议(HTTP/1.1)
请求报文
头行
头部
主体
响应报文
头行(状态码)
头部(expires缓存期限)
主体(HTML文件)
二、HTTP方法
1.GET-从服务器获取一份文档
不安全:用URL传递参数,对任何人可见
幂等:GET请求的次数不会改变信息(不是特别理解,先写下)
对发送信息的数量有限制(200个字符)
2.POST-向服务器发送需处理的数据
对发送信息的数量无限制
3.PUT-将请求的主体存储在服务器上
4.DELETE-从服务器删除一份文档
三、常见状态码
200 OK-请求成功
301 Moved Permanently-资源移动,浏览器自动跳转
304 Not Modified-资源未修改,浏览器读取缓存数据
400 Bad Request-请求语法错误,服务器无法理解
404 Not Found-未找到资源
500 Internal Server Error-服务器内部错误
首位数决定了状态码类型
1:服务器收到请求,正在处理
2:成功
3:重定向
4:客户端错误
5:服务器错误
四、AJAX(Asynchronous JavaScript and XML异步的JS和XML)
实例化一个XHR对象(兼容版)
方法一
function getHTTPObject() {
if (typeof XMLHttpRequest == "undefined")
XMLHttpRequest = function() {
try {return new ActiveXObject("Msxml2.XMLHTTP.6.0");}
catch(e) {}
try {return new ActiveXObject("Msxml2.XMLHTTP.3.0");}
catch(e) {}
try {return new ActiveXObject("Msxml2.XMLHTTP");}
catch(e) {}
return false;
}
return new XMLHttpRequest();
}
方法二
var xhr;
if(window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
} else {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
XHR方法
xhr.open()
xhr.setRequestHeader() //POST使用
xhr.send() //POST时需有参数
取得响应
xhr.responseText //字符串形式的响应数据
xhr.responseXML //XML形式的响应数据
xhr.statusxhr.statusText //数字、文本形式的状态码
xhr.getAllResponseHeader() //获取所有响应头
xhr.getResponseHeader() //获取响应头中的某字段
readyState属性(服务器响应的变化)
0:未初始化,open未调用
1:连接建立,open调用
2:请求已接收,服务器已接收头信息
3:请求处理中,已接收主体
4:请求已完成,响应就绪
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
//do something
}
}