关于AJAX异步请求的那些事儿(1)
1、什么事AJAX?
Asynchronous Javascript And XML:异步的JS和XML,由Google2002年在GoogleSuggest应用提出,目标实现客户端和服务器“同时”运行——异步的HTTP请求和响应,客户端不会经常出现“一片惨白”,提高浏览体验。涉及到的技术:HTML、CSS、JS、DOM、XML、JSON等,属于前端范畴,是纯客户端技术。
2、AJAX实现的效果:
(1)客户端和服务器异步运行
(2)客户端页面的局部刷新
(3)动态页面的静态化
3、使用AJAX的步骤
(1)创建XHR对象:var xhr=null;
if(window.XMLHttpRequest){
xhr=new XMLHttpRequest;
}else{
xhr=new ActiveXObject("Microsoft.XMLHTTP");
}
(2)绑定onreadyStatechange监听函数
xhr.onreadystatechange = function(){
}
(3)创建请求消息,建立到服务器的连接
xhr.open('GET/POST', 'xx.php', true);
(4)发送请求消息
xhr.send(null/data);
3、XMLHttpRequest的常用成员
常用成员属性: |
|
status:0 |
保存着服务器返回的响应消息的状态码 |
statusText:'' |
保存着服务器返回的响应消息的原因短句 |
responseText:'' |
保存着响应消息的主体——看做一段String |
responseXML:null |
保存着响应消息的主体——看做一个XMLDOM对象 |
timeout:0 |
设置XHR发起请求消息后,等待服务器给出响应消息的持续时间 |
readyState:0 只读的,其值是随着请求/响应的进程而自动改变的——用于描述当前请求/响应进行到哪一步了 |
0 - UNSENT 请求消息尚未发送 1 - OPENED XHR已创建请求消息,打开针对服务器的连接 2 - HEADERS_RECEIVED XHR对象已经接收到响应消息的头部 3 - LOADING XHR正在加载响应主体数据 4 - DONE XHR对象已经接收完毕响应消息 |
常用成员事件: |
|
onreadystatechange:fn |
当XHR的readyState值发生改变,触发此句柄 |
ontimeout:fn |
当XHR的请求超时,触发此句柄 |
onerror:fn |
当XHR发生请求/响应错误,触发此句柄 |
常用的成员方法: |
|
getAllResponseHeaders() |
获取响应消息中所有的头部 |
getResponseHeader(headerName) |
获取响应消息中指定的头部 |
open(METHOD, URI, isAysnc) |
创建一个HTTP请求消息,打开一个针对服务器的连接 |
send( null/'k1=v1&k2=v2&...' ) |
发送HTTP请求消息 |
setRequestHeader(name, value) |
在请求消息发送之前,设置一个请求消息头部 |
最新文章
- SPOJ FASTFLOW网络流水题
- 【Openlayers3】在地图上添加highcharts图表
- CGAffineTransformMakeRotation 实现旋转
- JavaScript实现在textbox输入时自动去数据库匹配并找出类似值列出,选择后记得将值填入本textbox及下一个textbox
- SQL书写规范及常用SQL语句
- mysql 报错之创建自定义函数
- Delphi 的运算符列表,运算符及优先级表格 good
- mongodb sort limit和skip用法
- deflate树与deflate编码
- Windows高速定时器,多媒体定时器winmm.dll库的使用
- linux pxe网络装机无人值守
- Django DetailView 多重继承 关系整理
- java基础-3
- Linux下编译安装Apache报APR not found错误的解决办法
- 查询数据库中含clob,blob的表
- Python——信号量
- MySql随手记要
- 简易页面场景滚动的jquery插件
- 命令行Scp的使用----远程拷贝文件
- Onject.Instantiate实例