实现AJAX的基本步骤
来源:互联网 发布:淘宝有没有hm旗舰店 编辑:程序博客网 时间:2024/06/05 14:35
AJAX(Asynchronous JavaScript and XML):是指一种创建交互式网页应用的网页开发技术,通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这就意味着可以在不重新加载整个网页的情况下,对网页的局部进行更新。
实现AJAX的基本步骤:
一、创建XMLHttpRequest对象
所有现代浏览器(IE7+、Firefox、Chrome、Safari 以及 Opera)均支持XMLHttpRequest 对象,而IE5 和 IE6 使用 的是ActiveXObject。
在现代浏览器中创建XMLHttpRequest对象的语法如下所示:
var xhr = new XMLHttpRequest();
在IE5 和 IE6中则使用ActiveXObject 对象:
var xhr = new ActiveXObject("Microsoft.XMLHTTP");
为了兼容所有的浏览器,判断浏览器是否支持XMLHttpRequest 对象。
var xhr;
if (window.XMLHttpRequest){
// 标准浏览器
xhr = new XMLHttpRequest();
}else{
// IE6, IE5
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
二、创建一个新的HTTP请求,并指定请求的方法、URL、是否异步处理请求及验证信息
xhr.open(method,URL,flag,username,userpass);
method:请求的类型(GET、POST、PUT、DELETE、HEAD......)
URL:文件在服务器上的位置
flag:是否异步请求。可选参数,参数值为布尔类型。true表示异步方式、false表示同步方式,默认为true。
username:该参数为可选参数,用于输入用户名。如果服务器需要验证,则必须使用该参数。
userpass:该参数为可选参数,用于输入密码。如果服务器需要验证,则必须使用该参数。
三、为onreadystatechange 事件绑定方法,监听状态的改变
xhr.onreadystatechange = function(){
if(xhr.readyState === 4 && xhr.status === 200){
var result = xhr.responseText;
}
}
readyState属性:表示请求/响应过程的当前活动阶段
0:未初始化。尚未调用 open()方法。
1:启动。已经调用 open()方法,但尚未调用 send()方法。
2:发送。已经调用 send()方法,但尚未接收到响应。
3:接收。已经接收到部分响应数据。
4:完成。已经接收到全部响应数据,而且已经可以在客户端使用了。
只有在XMLHttpRequest对象完成了以上5个步骤之后,才可以获取从服务器端返回的数据。
status属性:响应的 HTTP 状态码
200:响应成功
301:永久重定向/永久转移
302:临时重定向/临时转移
304:本次获取内容是读取缓存中的数据
400:请求参数错误
401:无权限访问
404:访问的资源不存在
......
四、发送HTTP请求
xhq.send(data);
其中data是个可选参数,请求主体发送的参数,如果请求的数据不需要参数,即可以使用null来替代。
只有在使用send()方法之后,XMLHttpRequest对象的readyState属性值才会开始改变,也才会激发readystatechange事件,并调用函数。
- 实现Ajax的基本步骤
- 实现AJAX的基本步骤
- 实现AJAX的基本步骤
- 实现AJAX的基本步骤
- 实现AJAX的基本步骤
- AJAX的基本实现步骤
- 实现AJAX的基本步骤
- 实现AJAX的基本步骤
- 实现AJAX的基本步骤
- 原始ajax的基本实现步骤
- ajax编程的基本步骤
- Ajax实现的步骤
- Ajax 的基本实现
- js实现ajax的步骤
- Ajax 异步请求的基本步骤
- IOCP 实现的基本步骤
- Ajax 基本操作步骤
- Ajax基本步骤
- Collection方法之五 对集合中元素进行遍历
- Leetcode 203 Remove Linked List Elements
- RegisterNatives注册失败,返回错误码-1
- Python 多线程使用总结
- 数据压缩实验1
- 实现AJAX的基本步骤
- 光源
- MyEclipse 常用快捷键总结
- linux tar.gz zip 解压缩 压缩命令
- tensorflow学习笔记十三:TF官方教程学习 TensorFlow Mechanics 101
- VS2012发布项目到服务器
- 基于DragonBoard 410c的家庭智能环保卫士——(5)获取kobuki位置信息
- freemarker教程
- 免费ARP