AJAX

l  AJAX全称：异步的JavaScript和XML

 

不是某种编程语言，是一种在无需重新加载整个页面情况下能够更新部分网页的技术。

 

l  读音：ajax  阿贾克斯~ no！

 

l  XMLHttpRequest对象：可以用于后台和服务器进行数据交换，对网页进行部分更新

 

l  概念介绍

 

n  运用HTML和CSS来实现页面，显示信息；

n  运用XMLHttpRequest对象和web服务器进行数据的异步交换；

n  运用JavaScript操作DOM，实现动态局部刷新；

 

一、关于XMLHttpRequest对象

　　首先实例化对象：

　　var request = new XMLHttpRequest();

 　  接下来就可以进行请求了，怎么请求呢？

二、HTTP请求

1. 　　请求方式GET或POST：get一般用于信息获取，用来查询，所有的变量都在URL中       post：一般用于修改服务器上的资源。
2. 　　URL
3. 　　请求头，包括一些客户端环境信息，身份验证信息等
4.       请求体，也就是正文

三、HTTP响应

1. 　　一个数字和文字组成的状态码，用来显示请求成功与否：200 OK      404 NOT Found（客户端错误）  500（服务器错误）
2.       响应头，一些服务器信息日期类型等
3.       响应体，正文

四、XHR的方法

• • 　　open(method,url,async)方法        methed:发送请求方式      async：请求同步或异步  true异步   false同步  默认true一般不填写
  •       send(string)发送方法           get一般没参数     post有参数
    • 　　request.open("POST","create.php",true);
    •       request.setRequestHeader("Content-type","application/x-www-form-urlencoded");          这个方法说明提交类型，不提交文件一般用这个，写在上下两个方法中间
    •       request.send("name=王二狗&sex=男"); 

五、XHR响应

•   readyState属性    （所以要监听这个属性的变化）
• 　　0：请求未初始化，open还没有调用
•       1：服务器链接已建立，open已经调用了
•       2：请求已接收，也就是接收到头信息了
•       3：请求处理中，也就是接收到响应主体了
•       4：请求已经完成，且响应已就绪，也就是响应完成了

　　　　var request = new XMLHttpRequest();

　　　　request.open("GET","get.php");

　　　　request.send();

　　　　request.onreadystatechange = function(){

　　　　　if (request.readyState===4&&request.status===200){   //响应完成且请求成功

　　　　　　//这里做些事情   比如在页面进行呈现

　　　　　　}

　　　　}