Ajax学习笔记

概念:Ajax是一种在不加载整个网页,就可以部分更新网页的技术。

  ① 运用HTML和CSS来实现网页,表达信息;

  ② 运用XMLHttpRequest和Web服务器来进行数据的异步交换;

  ③ 运用js操作DOM,实现动态局部刷新。

XMLHttpRequest对象

实例化: var request = new XMLHttpRequest();

如何兼容IE5、IE6甚至更早的浏览器?

var request;

if (window.XMLHttpRequest) {

  request = new XMLHttpRequest(); // IE7+,FireFox,CHrome,OPera...

} else {

  request = new ActiveXObject("Microsoft.XMLHttp"); // IE6,IE5

}

Http: Http是一套计算机通过网络进行协议的规则,使得浏览器向服务器去请求信息和服务;

        Http协议是一种无状态的协议,使得浏览器和服务器不建立持久的联系,服务端不保留客户端传递的信息,这个连接没有任何记忆。

   如果后续需要之前传递的信息,则需要重新传递。

一个完整的Http请求包括哪些内容?

① 建立TCP连接

② Web浏览器向Web服务器发送请求命令

③ Web浏览器发送请求头信息

④ Web服务器应答

⑤ Web服务器发送应答头信息

⑥ Web服务器向浏览器发送数据

⑦ Web服务器关闭TCP连接

一个http请求包括:

① 请求的动作(GET/POST)

② 正在请求的URL,即请求的地址

③ 请求头 (包括客户端环境信息,身份验证信息等)

④ 请求体,即正文部分 (包括客户提交的查询字符串信息,表单信息等)

一个http响应包括:

① 一个由数字和文字组成的状态码,用来显示请求是成功还是失败

② 响应头,和请求头一样包含很多有用的信 (包括服务器类型,日期时间等)

③ 响应体,即响应正文 

GET请求和POST请求的区别:

GET:一般用于获取信息;使用URL传递参数;对所发送的信息的数量有限制,一般在2000个字符。

POST: 一般用于修改服务器上的信息,对信息的隐私性好,对信息数量无上限。

XMLHttpRequest发送请求:
.open(method,url,aync)

.setRequsetHeader()

.send(String)

XMLHttpRequest取得响应:

.responseText: 获取字符串形式的响应数据

.responseXML: 获取XML形式的响应数据

.status/statusText:以数字和文本形式返回http状态码

.getAllResponseHeader(): 获取服务器所有的响应报头

.getRequestHeader(): 查询响应中某个字段的值

readyState属性

0:请求未初始化,open还没有调用

1:服务器连接已建立,open已调用

2:请求已经接收,也就是接收到了请求头信息了

3: 请求处理中,也就是接收到响应主体了

4: 请求已完成,且响应已就绪,也就是项英已经完成了

通过监听readystate获取返回的信息

eg.

   request.onreadystatechange = function () {

    if (request.readystate == 4 && request.state === 200){

      // to do sth...

    }

  }

原文地址:https://www.cnblogs.com/xiaoya625/p/9261167.html