每日JavaScript - 12

今天要说说Ajax。（自己对这方面不了解，为了避免误人子弟，只作个人浏览）

 xhr.open("get", "example.php", false)

这段代码会启动一个针对example.php的GET请求，第三个Boolean为是否异步的意思
在调用open()方法之后而且调用send()方法之前调用setRequestHeader()
可以自定义请求头部信息

xhr.open('POST', '/test/', true);
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded"); // 将请求头设置为表单方式提交
xhr.send('name=luozh&size=12');

xhr的readyState属性

0. 未初始化。尚未调用open()方法
1. 启动。已经调用open()方法，但尚未调用send()方法。
2. 发送。已经调用send()方法，但尚未接受到响应。
3. 接受。已经接受到部分响应数据。
4. 完成。已经接受到全部响应数据，而且已经可以在客户端使用。每次状态的改变都会触发一次readystatechange事件，我们使用onreadystatechange属性监听，

var xhr;

if (window.XMLHttpRequest) {
    xhr=new XMLHttpRequest();
} else if (window.ActiveXObject) {
    xhr=new ActiveXObject("Microsoft.XMLHTTP");
}

if (xhr) {
    xhr.open('GET', '/test/', true);     // 以GET请求的方式向'/test/'路径发送异步请求
    xhr.send();
    xhr.onreadystatechange = function () {    // 利用onreadystatechange监测状态
        if (xhr.readyState === 4) {    // readyState为4表示请求响应完成
            if (xhr.status === 200) {    // status为200表示请求成功
                console.log('执行成功');
            } else {
                console.log('执行出错');
            }   
        }
    }
}

xhr其他属性
responseText; 作为响应主体被返回的文本
status: 响应的HTTP状态
statueText: HTTP状态的说明

status状态码为200作为成功的标志，304时表示请求的资源没有被修改。可以直接使用浏览器中缓存的版本。

题外话
此文总结于JavaScript高级程序设计的Ajax章节，对于经典的知识还是看经典书籍最好。