Ajax获取服务器端的响应
一、Ajax 状态值
在创建ajax对象,配置ajax对象,发送请求,以及接收完服务器端响应数据,这个过程中的每一个步骤都会对应一个数值,这个数值就是ajax状态值。
ajax状态值 | 说明 |
---|---|
0 | 请求未初始化(还没有调用open()) |
1 | 请求已经建立,但是还没有发送(还没有调用send()) |
2 | 请求已经发送 |
3 | 请求正在处理中,通常响应中已经有部分数据可以用了 |
4 | 响应已经完成,可以获取并使用服务器的响应了 |
使用ajax对象下的readyState
属性可以到获取ajax的状态值
XMLHttpRequest.readyState // 获取Ajax状态值
这里需要注意和区分一下 Ajax状态值与状态码(Http状态码)的区别
Ajax状态码(值): 表示Ajax请求的过程状态 ajax对象返回的
Http状态码: 表示请求的处理结果 是服务器端返回的
二、onreadystatechange 事件
只要 readyState
属性发生变化,就会调用相应的处理函数。这个回调函数会被用户线程所调用。XMLHttpRequest.onreadystatechange
会在 XMLHttpRequest
的readyState
属性发生改变时触发 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
。
后来,许多浏览器实现了一些额外的事件(onload
、onerror
、onprogress
等)。详见 使用 XMLHttpRequest。
更多现代浏览器,包括 Firefox,除了可以设置· on* ·属性外,也提供标准监听器 addEventListener() API
来监听XMLHttpRequest
事件。
三、两种获取服务器端响应方式的区别
区别描述 | onload事件 | onreadystatechange事件 |
---|---|---|
是否兼容IE低版本 | 不兼容 | 兼容 |
是否需要判断Ajax状态码 | 不需要 | 需要 |
被调用次数 | 一次 | 多次 |
推荐使用onload
事件
Ajax获取服务器端的响应相关推荐
- Ajax --- 获取服务器端的响应
虽然这种方式已经过时了,但是依然还有很多人在用.因此,把它作为了解的知识点,当看到别人在用时,知道是什么意思就可以了. 1. 先了解 ajax 状态码 在创建ajax对象,配置ajax 对象,发送请求 ...
- 前端学习(1422):ajax获取服务器端的响应
// 引用expess框架 const express = require('express'); // 处理路径 const path = require('path');const bodyPar ...
- Ajax获取服务器端响应数据的两种方式
方式一:onload xhr.onload = function (){console.log(xhr.responseText);} 方式二: Ajax状态码: 在创建ajax对象,配置ajax对象 ...
- ajax获取服务器端数据参数详解
1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如 ...
- AJAX学习笔记(基本使用,请求参数传递,获取服务端响应,错误处理,低版本IE浏览器缓存问题及解决)
1. Ajax实现步骤 创建ajax对象 let xhr = new XMLHttpRequest(); 告诉ajax请求地址及请求方式 xhr.open('get','http://www.exam ...
- 使用ajax从服务器端获取数据
使用ajax从服务器端获取数据的步骤: 代码表示: <!DOCTYPE html> <html><head><meta charset="UTF-8 ...
- Ajax获取gzip,如何在javascript中解压缩gzip xhr响应
我有一个来自Web请求的gzipped响应,我需要在JavaScript中解压缩(实际上,在AJAX调用的成功函数中 - 我的代码在无头浏览器中运行,并且没有内置的gzip完整浏览器提供的处理支持). ...
- js获取应用服务器时间,JavaScript获取服务器端时间的方法
用js做时间校正,获取本机时间,是存在bug的. 使用js也可获取到服务器时间,原理是使用 ajax请求,返回的头部信息就含有服务器端的时间信息,获取到就可以了.以下: 1.依赖jQuery 代码: ...
- ajax对日期处理,AJAX获取服务器当前时间及时间格式输出处理
AJAX获取服务器当前时间 ------------------------------ WebService1.asmx---------------------------------- // 若 ...
最新文章
- 跟你聊得这么投缘,你却说自己不是人?!
- 通过钉钉群聊机器人推送zabbix告警
- 如何在 C# 平台调用云开发?
- mysql批量生成修改表和列注释语句
- Qt工作笔记-绘制静态折线图
- 认知空间是什么意思_为什么会选择3D立体摄影
- Spring零配置之@Configuration注解详解。
- 图片切换,带标题文字
- 深夜十点,北京各大互联网企业的下班高峰才刚开始?北晚记者带您实地探访...
- 深入了解Spring的@Scope注解中作用域代理proxyMode属性的实现
- Lua的自我学习之路-语法学习9
- AVFrame的数据填充方式
- v4手游服务器维护,v4手游每日必做事项分享
- RoadMap:面向自动驾驶视觉定位的轻量级语义地图(ICRA2021)
- js 对象解构 默认值 重命名
- 期货、股票行情、交易源码
- 个人编译移动内核时遇到的一些问题报错及处理方法【不定时更新2021.1.3】
- TI-RTOS学习笔记(三)—— 驱动程序框架
- # BJTUOJ 一颗姜会长多高? (二分+前缀和+简单贪心)
- 使用.NET 将PDF转成Word