原生ajax封装(自学简单版)

/*原生ajax封装*/
function ajax(data){
	/*data={
		data:"",
		dataType:"xml/json",
		type:"get/post",
		url:"",
		asyn:"true/false",
		success:function(){},
		failure:function(){}
	}*/
	//data:{username:123,password:456}
	//data = 'username=123&password=456';

	//第一步:创建xhr对象
	var xhr = null;
	if(window.XMLHttpRequest){//标准的浏览器
		xhr = new XMLHttpRequest();
	}else{
		/*兼容万恶的IE*/
		xhr = new ActiveXObject('Microsoft.XMLHTTP');
	}

	//第二步:准备发送前的一些配置参数
	var type = data.type == 'get'?'get':'post';/*根据data设置发送参数*/
	var url = '';
	if(data.url){
		/*设置url*/
		url = data.url;
		if(type == 'get'){
			url += "?" + data.data + "&_t="+new Date().getTime();
		}
	}
	var flag = data.asyn == 'true'?'true':'false';/*标志位表示是否异步*/
	xhr.open(type,url,flag);

	//第三步:执行发送的动作
	if(type == 'get'){
	   xhr.send(null);
	}else if(type == 'post'){
	   xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
	   xhr.send(data.data);
	}

	//第四步:指定回调函数
	xhr.onreadystatechange = function(){
		if(this.readyState == 4){
			if(this.status == 200){
				if(typeof data.success == 'function'){
					var d = data.dataType == 'xml'?xhr.responseXML:xhr.responseText;
					data.success(d);
				}
			}else{
				if(typeof data.failure == 'function'){
					data.failure();
				}
			}
		}
	}
}

如有宝贵意见,请各位大神不吝赐教


以上

  • 2
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值