一、AJAX简介
1、Asynchronous JavaScript And XML指异步 JavaScript 及 XML
2、老技术新用法。是基于JavaScript、XML、HTML、CSS新用法
二、同步和异步(理解)
三、第一个异步请求案例(熟悉编码步骤)
四、XmlHttpRequest(JS)对象详解(重点)
1、创建XmlHttpRequest对象
不同浏览器,设置相同浏览器的版本,创建该对象的方式是不同的。
解决办法:
a、从w3cshool的文档中拷贝。
b、将来:用jQuery等框架
2、XmlHttpRequest对象的属性
a、readyState:short只读
标识着当前的请求状态
0:XmlHttpRequest对象被创建了。此时为0
1:建立与服务器的链接,但是请求还没有发出去。此时为1。open(),send()还没有执行。
2:发出了请求,但是服务器没有任何响应。此时为2
3:接收到了服务器的响应,接收到了服务器发出的响应消息头时,此时3.
4:接收到了服务器发送的响应正文,响应结束。此时为4
b、status:代表着响应状态码
c、statusText:响应码描述
d、responseText:字符串类型。代表着响应正文内容,把他当做文本对待
e、responseXML:Document。代表着响应正文内容,把他当做一个Document对象。(DOM)
3、XmlHttpRequest的方法
a、getAllResponseHeaders():返回的是所有的响应消息头。是一个字符串。
b、getResponseHeader(var headerName):返回指定响应消息头的值。是一个字符串。
c、open(var method,var url,boolean isAnsy):建立连接。
method,请求方式
url,请求的地址
isAnsy,同步还是异步。默认是true,就是异步。
d、send(var data):向服务器发送请求正文。如果是get请求,请求传入null.
如果是post请求:data="username=abc&password=123"
e、setRequestHeader(var headerName,var headerValue):向服务器发送请求消息头。
4、XmlHttpRequest的状态监听器
onreadystatechange,指向是一个函数。回调函数。
何时触发执行,每次XHR对象的readyState发生变化都会触发。
一般写法:
xhr.onreadystatechange=function(){
if(xhr.readyState==4){
if(xhr.status==200){
//JS之DOM、BOM编程
}
}
}