失眠网,内容丰富有趣,生活中的好帮手!
失眠网 > Ajax获取服务器端的响应

Ajax获取服务器端的响应

时间:2019-02-27 08:49:50

相关推荐

Ajax获取服务器端的响应

一、Ajax 状态值

在创建ajax对象,配置ajax对象,发送请求,以及接收完服务器端响应数据,这个过程中的每一个步骤都会对应一个数值,这个数值就是ajax状态值。

使用ajax对象下的readyState属性可以到获取ajax的状态值

XMLHttpRequest.readyState // 获取Ajax状态值

这里需要注意和区分一下 Ajax状态值与状态码(Http状态码)的区别

Ajax状态码(值): 表示Ajax请求的过程状态 ajax对象返回的

Http状态码: 表示请求的处理结果 是服务器端返回的

二、onreadystatechange 事件

只要readyState属性发生变化,就会调用相应的处理函数。这个回调函数会被用户线程所调用。XMLHttpRequest.onreadystatechange会在XMLHttpRequestreadyState属性发生改变时触发readystatechange事件的时候被调用。

语法:

XMLHttpRequest.onreadystatechange = callback;

取值:readyState的值改变的时候,callback函数会被调用。

示例:

var xhr = new XMLHttpRequest();// 0 已经创建了ajax对象 但是还没有对ajax对象进行配置console.log(xhr.readyState);xhr.open('get', 'http://localhost:3000/readystate');// 1 已经对ajax对象进行配置 但是还没有发送请求console.log(xhr.readyState);// 当ajax状态码发生变化的时候出发xhr.onreadystatechange = function() {// 2 请求已经发送了// 3 已经接收到服务器端的部分数据了// 4 服务器端的响应数据已经接收完成console.log(xhr.readyState);// 对ajax状态码进行判断 如果状态码的值为4就代表数据已经接收完成了if (xhr.readyState == 4) {console.log(xhr.responseText);}} xhr.send();

作为XMLHttpRequest实例的属性,所有浏览器都支持onreadystatechange

后来,许多浏览器实现了一些额外的事件(onloadonerroronprogress等)。详见 使用 XMLHttpRequest。

更多现代浏览器,包括 Firefox,除了可以设置· on* ·属性外,也提供标准监听器addEventListener() API来监听XMLHttpRequest事件。

三、两种获取服务器端响应方式的区别

推荐使用onload事件

如果觉得《Ajax获取服务器端的响应》对你有帮助,请点赞、收藏,并留下你的观点哦!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。