完整的ajax程序包

摘自<<精通javascript>>
XML:所有的浏览器都支持原生XML的文档处理,自动将它们转换为可用的DOM文档。
HTML:和XML文档的区别在于,它通常以纯文本字符串的形式存在,存放一个HTML片段
Javscript/Json:这包括两种格式--原始的可执行的javascript代码和Json(javascript object Notation,Javascript对象表示)格式。

获取HTTP响应数据的重点是XMLHTTPRequest对象的两个属性
responseXML:如果服务器返回的是XML文档,这个属性包含到预处理后DOM文档的引用,它是XML文档的表达。只在服务器明确指定其内容首部(content header)是"content-

type:text/xml"或类似XML的数据类型时才有效。

responseText:这一属性包含到服务器返回的原始文本数据的引用。HTML和Javascript类型的数据都依赖这一方法来获得。



/**
*处理错误:
*1、成功响应代码:通过读取代码,客户端能够知道服务器的情形。状太码在200-300之间属于成功的请求
*2、未修改响应:'Not Modified(未修改)'的标记,也就是状态码304。说明返回的数据与浏览器的
* 缓存内容一致,并未修改过。其实不算错误,因为客户端仍能读出正确的数据
*3、本地存储的文件:在本机上直接执行Ajax应用程序,不通过web服务器,就算请求成功了,也不
* 会得到任何返回的状态码。执行本地文件且得不到状态码时,算成功响应
*4、Safari与未修改状态:文档处上次请求未曾修改过,Safari返回的状太码会是'undefined'
*/
if(typeof XMLHttpRequest == 'undefined')
XMLHttpRequest = function(){
return new ActiveObject(navigator.userAgent.indexOf("MSIE 5")>=0?"Microsoft.XMLHTTP":"Msxml2.XMLHTTP");
};
function ajax(options){
//执行Ajax 请求的通用函数
//如果用户没有提供某个选项的值,就用默认值替代
options={
//HTTP请求类型
type:options.type||"POST",
//请求的URL
url:options.url || "",
//请求超时的时间
timeout:options.timeout ||5000,
//请求失败、成功或完成(不管成功还是失败都会调用的)时执行的函数
onComplete:options.onComplete || function(){},
onFail:options.onFail || function(){},
onSuccess:options.onSuccess || function(){},
//服务器将会返回的数据类型,这一默认值用于判断服务器返回的数据并作相应动作
data:options.data || ""
};
//创建请求对象
//var xml = new XMLHttpRequest();
var xml=createXMLHttpRequest();

//初始化异步请求
xml.open(options.type,options.url,true);

//在请求后等待5秒,超时同放弃
var timeoutLength=options.timeout;

//记录请求是否成功完成
var requestDone = false;

//初始化一个5秒执行的回调函数,用于取消请求(如果尚未完成的话)
setTimeout(function(){
requestDone=true;
},timeoutLength);

//监听文档状态的更新
xml.onreadystatuschange = function(){
//保持等待,直到数据完全加载,并保证请求并未超时
if(xml.readyState == 4 && !requestDone){
//检查是否请求成功
if(httpSuccess(xml)){
//以服务器返回的数据作为参数调用成功回函数
options.onSuccess(httpData(xml,options.type));

//否则就请求失败,执行失败回调函数
}else{
options.onFail();
};

//调用完成回调函数
options.onComplete();
//为避免内存泄,清理文档
xml=null;

};
};

//建立与服务器的连接
xml.send();

//判断HTTP响应是否成功
function httpSuccess(r){
try{
//如果得不到服务器状态,且我们正在请求本文件,认为成功
return !r.status&&location.protocol=='file:'||
//所有200到300间的状态码表示成功
(r.status>=200&& r.status<300)||
//文档未修改也算成功
r.status==304||
//Safari 在文档修改时返回空状态
navigator.userAgent.indexOf('Safari')>=0&&typeof r.status =='undefined';

}catch(e){
//若检查状态失败,就假定请求是失败的
return false;
}
};

//从HTTP响应中解析正确数据
//有两个参数:一个XMLHttpRequest对象和一个可选参数----期望从服务器得到的数据类型
//正确的值包括:xml,script,text或html --默认是'',根据content-type的首部得到
function httpData(r,type){
//获取 content-type的首部
var ct = r.getResponseHeader("content-type");

//若没有提供默认的类型,判断服务器返回的否是XML形式
var data= !type && ct && ct.indexOf("xml")>=0;

//若是,获得XML文档对象,否则返回文本内容
data = type=="xml" || data?r.resonpseXML:r.responseText;

//若指定类型是"script",则以javascript形式执行返回文本
if(type=="script"){
eval.call(window,data);
};

//返回响应数据(或为XML文档或为文本字符串)
return data;
};
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值