ajax请求过程以及请求方法的案例分析

　　介绍

这篇文章将为大家详细讲解有关ajax请求过程以及请求方法的案例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。

ajax的全称是异步JavaScript和XML,其中,异步是异步的意思,它有别于传统web开发中采用的同步的方式。据小编翻墙了解到,ajax很早就有了,只不过那时候都不用它,后来谷歌把它用在谷歌地图上,人们感觉使用起来很方便,而且页面不用刷新,用户体验非常好(那时候的网站也没有什么用户体验^ _ ^)

<强> ajax原理

XMLHttpRequest是ajax的核心机制,它是在IE5中首先引入的,是一种支持异步请求的技术。简单的说,也就是JavaScript可以及时向服务器提出请求和处理响应,而不阻塞用户,达到页面无刷新的效果

var xhr=new XMLHttpRequest ()//IE浏览器使用var xhr=新ActiveXObject 　　xhr.open(& # 39;得到# 39;,url,真的) 　　xhr.send(空) 　　xhr。onreadystatechange=function () { 　　如果(xhr。readyState==4) { 　　如果(xhr。状态==200){ 　　成功(xhr.responseText) 　　其他}{ 　　失败,,失败(xhr.status) 　　} 　　} 　　}

<>强xhr.open()

第三个参数:真实/意见默认值为真
假就是等待有返回数据的时候再继续往下走,还没有得到数据的时候就会卡在那里,直到获取数据为止。
真的就是不等待,直接返回,这就是所谓的异步获取数据!

<强> xhr。发送

需要传送的数据,接受一个字符串类型

<强> xhr。onreadystatechange

每次状态改变所都会触发的事件处理程序

<强> xhr。判别有以下几种状态

0请求未初始化,开放的方法尚未调用

1服务器连接已建立,开放的方法已经调用,尚未调用发送方法

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

3请求处理中,也就是接收到响应主体了,这时因为响应及http头不全,这时通过responseBody和responseText获取部分数据会出现错误

4请求已完成,数据接收完毕,此时可以通过通过responseXml和responseText获取完整的回应数据

<强> xhr.status常见http状态

0 * *:未被始化

1 * *:请求收的到,继续处理

2 * *:操作成功收的到,分析,接受

3 * *:完成此请求必须进一步处理

4 * *:请求包含一个错误语法或不能完成

5 * *:服务器执行一个完全有效请求失败

<强> jQuery。ajax

. ajax({美元 　　url: & # 39; & # 39; 　　类型:& # 39;& # 39; 　　数据:& # 39;& # 39; 　　异步:没错, 　　数据类型:& # 39;& # 39; 　　beforeSend:函数(xhr) { 　　xhr.setRequestHeader (“Access-Toke"); 　　}, 　　成功:功能(数据){ 　　fn1 () 　　}, 　　错误:函数(err) { 　　错误,,错误(错误) 　　} 　　}) 　　fn2 ()

<强>成功——函数

$ . ajax中成功的方法是否获取成功的回调,jQuery判断了以下几种状态,在源码中有以下代码(大概位置8193行)

isSuccess=地位祝辞=200,,状态& lt;300 | |状态===304

304 - - -通常的说法就是浏览器还有缓存,服务器告诉客户,原来缓存的文档还可以继续使用

<强>异步-布尔值

异步默认的设置值为true,这种情况为异步方式,就是说当ajax发送请求后,在等待服务器端返回的这个过程中,前台会继续执行ajax块后面的脚本,直到服务器端返回正确的结果才会去执行成功,也就是说这时候执行的是两个线程,ajax块发出请求后一个线程和ajax块后面的脚本(另一个线程)

asyn设为假时,这时ajax的请求时同步的,也就是说,这个时候ajax块发出请求后,他会等待在fn1()这个地方,不会去执行fn2(),知道fn1()部分执行完毕。

<>强数据类型——字符串

数据类型可以指定以下值

xml:返回xml文档,可用JQuery处理

html:返回纯文本html信息;包含的脚本标签会在插入DOM时执行

脚本:返回纯文本JavaScript代码。不会自动缓存结果。除非设置了缓存参数。注意在远程请求时(不在同一个域下),所有帖子请求都将转为得到请求

json:返回json数据

jsonp: jsonp格式。使用SONP形式调用函数时,例如myurl ?回调=?,JQuery将自动替换后一个”?“为正确的函数名,以执行回调函数

文本:返回纯文本字符串

<强> beforeSend——函数

送请求前可以修改XMLHttpRequest对象的函数,例如添加自定义HTTP头。在beforeSend中如果返回假可以取消本次ajax请求.XMLHttpRequest对象是惟一的参数

ajax请求过程以及请求方法的案例分析