AJAX学习（基础知识）AJAX学习（基础知识）

51 阅读 0 评论 34 点赞

我是靠谱客的博主光亮小蝴蝶，最近开发中收集的这篇文章主要介绍AJAX学习（基础知识）AJAX学习（基础知识），觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

AJAX学习（基础知识）

HTTP请求-概念介绍

var request = new XMLHttpRequest();
一个完整的HTTP请求过程，通常有下面七个步骤

1.建立TCP连接
2.Web浏览器向Web服务器发送请求命令
3.Web浏览器发送请求头信息
4.Web服务器应答
5.Web服务器发送应答头信息
6.Web服务器向浏览器发送数据
7.Web服务器关闭TCP连接
（一般http走的都是tcp连接）

一个HTTP请求一般由四部分组成：
1.HTTP请求的方法或动作，比如GET或POST请求
2.正在请求的URL，（请求的地址）
3.请求头，包含一些客户端环境信息，身份验证信息等
4.请求体，即请求正文，请求正文中可以包含客户提交的查询字符串信息，表单信息等等
（请求头和请求体之间用一个空行分隔）

介绍GET请求和HTTP请求
1.GET：一般用于信息获取
使用RUL传递参数
对所发送信息的数量也有限制，一般在200个字符。
（一般用于查询获取操作，不对页面进行修改）
2.POST：一般用于修改服务器上的资源
对所发送信息的数量无限制
（一般用于从表单中发送一些数据，发送表单数据，新建修改删除等）
3.幂等的概念
操作一次和一万次是一样的，get是幂等的。

一个HTTP响应一般由三部分组成
1.一个数字和文字组成的状态码，用来显示请求是成功还是失败
2.响应头，响应头也和请求头一样包含许多有用的信息，如服务器类型，日期时间，内容类型和长度等。
3.响应体。即响应正文

HTTP状态码组成
HTTP状态码由三位数字组成，其中首位数字定义了状态码的类型：
1XX：信息类，表示收到Web浏览器请求，正在进一步的处理中
2XX：成功，表示用户请求被正确接收，理解和处理，如200，OK
3XX：重定向，表示请求没有成功，客户必须采取进一步的动作
4XX：客户端错误，表示客户端提交的请求有错误，如404 NOT FOUND，意思是请求中所引用的文档不存在
5XX：服务器错误，表示服务器不能完成对请求的处理：如 500

XHR发送请求
XHR的方法：
open（method, url, async) method:发送请求方法get或post， url:请求地址相对或绝对地址 async:同步或异步 true代表异步，一般采用异步，默认是true
send(string)

request.open(“GET”,”get.php”,true);
request.send();

request.open(“POST”,”creat.php”,trus);
request.setRequestHeader(“Contentype”,”application/x-www-form-urlencoded”);
request.send(“name=张三&job=厨师“);

XHR取得响应
利用XHR的方法和属性
responseText：获得字符串i型哪个是的响应数据
responseXML：获得XML形式的响应数据
status和statusText：以数字和文本形式返回HTTP状态码
getAllResponseHeader();获取所有的响应报头
getResponseHeader();查询响应中的某个字段的值
readyState属性：（监听这个属性的变化）
0：请求未初始化。open还没调用
1：服务器连接以建立。open已经调用了
2：请求已接受，接收到头信息了
3：请求处理中，接收到响应主体了
4：请求已完成且响应以就绪，即响应完成了
var request=new XMLHttpRequest();
request.open(“GET”,”get.php”,true);
request.send();
request.onreadystatechange=function(){
if(request.readyState==4&&request.status===200){
//响应完成且请求成功，做一些事情，request.responseText
}
}
request.onreadystatechange在每次readyState变化时会触发。