AJAX小笔记

AJAX（Asynchronous JavaScript and XML，异步的JavaScript和XML）是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。

1.XMLHttpRequest对象创建

创建对象是对对象进行实例化，创建前首先检查浏览器是否支持。

<span style="font-size:14px;">var xmlhttp;if(window.XMLHttpRequest){xmlhttp=new XMLHttpRequest();}//支持用IE7以上，Chrome,FireFox..else{xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");//支持IE6，5..（现在浏览器可忽略）}</span>

2.HTTP请求

HTTP是一种无状态（不建立持久的连接）协议。

一个完整的HTTP请求过程：

（1）建立TCP连接

（2）Web浏览器向Web服务器发送请求命令

（4）Web浏览器发送请求头信息

（4）Web服务器应答

（5）Web服务器发送应答头信息

（6）Web服务器向浏览器发送数据

（7）Web服务器关闭TCP连接

一个HTTP请求分为四部分：

（1）HTTP请求的方法或动作，如GET/POST

（2）正在请求的URL

（3）请求头，包含一些客户端环境信息，身份验证信息等

（4）请求体，就是请求正文

3.XMLHttpRequest向服务器发送请求

XMLHttpRequest对象对于和服务器交换数据。

向服务器发送请求，使用open()和send()方法。

（1）open(method，url，async)

method为请求的类型：GET/POST；

url为文件在服务器上的位置；

async：true(异步，默认值)、false（同步）。

GET：一般用于信息的获取（一般作查询或获取的操作，而不是修改信息）

使用URL传递参数；

对所发送信息的数量有限制，一般在2000个字符。

GET也被说是幂等（不管执行多少次，效果是相同的，所以说GET方法也是安全的）的。

POST：一般用于修改服务器上的资源

对所发送信息的数量无限制

（2）send（string）将请求发送到服务器

GET请求中，send中不用给出参数。string仅用于POST请求中。

以下情况下，使用POST请求：

（1）无法使用缓存文件（更新服务器上的文件或数据库）

（2）向服务器发送大量数据

（3）发送包含未知字符的用户输入时，POST比GET更稳定更可靠

4.HTTP响应

一个HTTP响应由三部分组成：

（1）一个数字和文字组成的状态码，用来显示请求是成功还是失败；

（2）响应头，响应头和请求头一样，包含许多有用的信息，例如服务器类型、日期时间、内容类型和长度等；

（3）响应体，就是响应正文。

HTTP状态码由三位数字构成，

1XX：信息类，表示收到Web浏览器请求，正在进一步的处理中

2XX：成功，表示用户请求被正确接收，理解和处理，例如：200 OK

3XX：重定向，表示请求没有成功，客户必须采取进一步的动作

4XX：客户端错误，表示客户端提交的请求有错误，例如：404 NOT Found，意味着请求中所引用的文档不存在。

5XX：服务器错误，表示服务器不能完成对请求的处理，例如：500

5.XMLHttpRequset取得响应

responseText获得字符串形式的响应数据responseXML获得XML形式的响应数据status和statusText以数字和文本形式返回HTTP状态码getAllResponseHeader()获得所有的响应报头getResponseHeader()查询响应中的某个字段的值
如何判断服务器已经响应了呢？

readyState属性：在响应返回成功时，得到通知。该属性的变化代表着服务器响应的变化。

• 0：请求未初始化，open还没有调用
• 1：服务器连接已建立，open已经调用了
• 2：请求已接收，也就是接收到头信息了
• 3：请求处理中，也就是接收到响应主体了
• 4：请求已完成，且响应已就绪，也就是响应完成了

如果要指导服务器的响应有没有完成，就需要监听属性的变化。

通过onreadystatechange事件进行监听，在每次readyState变化时触发。

通过AJAX，JavaScript无需等待服务器响应，而是：

（1）在等待服务器响应时执行其他脚本

（2）当响应就绪后对响应进行处理