如何创建AJAX

首先在创建AJAX之前,需要注意如下几个点:
(1)XMLHttpRequest 对象的工作流程
(2)兼容性处理
(3)事件的触发条件
(4)事件的触发顺序

下面开始创建AJAX

 if(opt.url){
 // 第一步,XMLHttpRequest对象的声明,以及浏览器的兼容
  var xhr = XMLHttpRequest ? new XMLHttpRequest() : new window.ActiveXObject('Microsoft.XMLHTTP');
  var data = opt.data,
      url = opt.url,
      type = opt.type.toUpperCase(),
      dataArr= [];
   for(var k in data ){
	dataArr.push(k + '=' + data[k]);
	}
	if(type === 'GET'){
	  url = url + '?' + dataArr.join('&');
	  // 第二步,确定XMLHttpRequest的发送方式
	  xhr.open(type,url.replace(/\?$/g,''),true);
	  // 第三步,发送出去
	  xhr.send();
	}
	if(type === 'POST'){
	  xhr.open(type,url,true);
	  xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded');
	  xhr.send(dataArr.join('&'));
	}
	//第四步 响应,这里这监听事件,监听成功或失败的
	xhr.onload = function () {
	  if(xhr.status === 200 || xhr.status === 304){
	  	var res;
	  	if(opt.success && opt.success instanceof Function){
	  	 res = xhr.responseText;
	  	 if(typeof res === 'String'){
	  	    res = JSON.parse(res);
	  	    opt.success.call(xhr,res);
	  	 }
	  	}
	  } else {
	    if(opt.error && opt.error instanceof Function){
	    	opt.error.call(xhr,res);
	    }
	  }
	}
  
 }

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值