Ajax笔记
异步交互技术
同步:
1.刷新整个页面
异步:
- 无需等待服务器响应,然后就可以发第二个请求!
- 可以使用js接受服务器的响应,然后使用js来局部刷新
两种数据传输格式:
- XML
- Json(Java script Object nonation)
学习AJAX只需要获得一个对象XMLHttpRequest
- 大多数浏览器都支持通过var XmlHttp = new XMLHttpRequest();
- IE6中 var XmlHttp = new ActiveXObject(”Msxml2.XMLHTTP”);
- IE5.5更早以前var XmlHttp = new ActiveXObject(“Microsoft.XMLHTTP”)
编写创建XmlHttpRequest的函数
function createXMLHttpRequest() {
var xmlHttp;
// 适用于大多数浏览器,以及IE7和IE更高版本
try{
xmlHttp = new XMLHttpRequest();
} catch (e) {
// 适用于IE6
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
// 适用于IE5.5,以及IE更早版本
try{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){}
}
}
return xmlHttp;
}
打开与服务器的连接
通过xmlHttp.open();用来打开与服务器的连接,他需要三个参数
- 请求方式:可以是GET或Post
- 请求的URL:指定服务器端资源
- 请求是否为异步:如果是true表示发送异步请求,否则同步请求
发送请求
- xmlHttp.send(null); 如果不给可能有部分浏览器无法发送,参数:请求的内容
最后一步
- 在xmlHttp对象的一个事件上注册监听器:onreadystatechange
xmlHttp对象有5个状态
- 状态0:刚创建,还没有调用open()方法;
- 状态1:请求开始,调用了open()方法,但还没有调用send()方法
- 状态2:调用完send()方法了。
- 状态3:服务器已经开始响应了,但不表示响应结束了
- 状态4:服务器响应结束了!
得到xmlHttp对象状态
- var state = xmlHttp.readyState;(0,1,2,3,4)
得到服务器响应的状态码
- var status = xmlHttp.status;//获得服务器状态码
得到服务器响应的内容
-var content = xmlHttp.responseText;
-var content = xmlHttp.responseXML;