加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

Ajax学习

发布时间:2020-12-15 21:50:28 所属栏目:百科 来源:网络整理
导读:ajax 请求: 1.创建Ajax对象 2.连接服务器 3.发送请求 4.接收返回值 eg:
ajax 请求:

1.创建Ajax对象

2.连接服务器

3.发送请求

4.接收返回值


eg: 取‘123.txt’中的数据:


1.创建Ajax对象(两种方法创建)

- ie6:newActiveXObject("Microsoft.XMLHTTP");

- 其他:newXMLHttpRequest();

兼容写法:

        var oAjax=null;
        if(window.XMLHttpRequest){          //必须判断属性,不能用变量
		oAjax=new XMLHttpRequest();
	}
	else{
		oAjax=new ActiveXObject("Microsoft.XMLHTTP");
	}

2.连接服务器

open(方法,url,是否异步),我们要取123.txt中的数据。

      oAjax.open('GET','123.txt',true);

3.发送请求

send()

      oAjax.send();

4.接收返回值,请求状态监控

onreadystatechange事件:
- readystate属性:请求状态
0:未初始化
1:已调用send()方法,真正该发送请求
2:send()方法已完成,已收到全部相应内容(可能被加密了)
3:正在解析相应内容(解析成js能理解的东西)
4:相应内容解析完成,不代表是否成功
- status表示是否成功。200成功,30*重定向,404没找到。

-responseText 取回服务器返回的数据

oAjax.onreadystatechange=function(){
	if(oAjax.readyState==4){
		if(oAjax.status==200){
			alert('成功'+oAjax.responseText);
		}<pre name="code" class="javascript">        <span style="font-family: Arial,Helvetica,sans-serif;">else{</span>
alert('失败');}}};
 

将ajaxj抽象成函数,供以后调用:

参数分别是请求数据地址,返回数据的函数,失败与否的提示

function ajax(url,fnSucc,fnFaild){
	var oAjax=null;
	if(window.XMLHttpRequest){
		oAjax=new XMLHttpRequest();
	}
	else{
		oAjax=new ActiveXObject("Microsoft.XMLHTTP");
	}
	oAjax.open('GET',url,true);
	oAjax.send();
	oAjax.onreadystatechange=function(){
		if(oAjax.readyState==4){
			if(oAjax.status==200){
				fnSucc(oAjax.responseText);
			}
			else{
				if(fnFaild){         
					fnFaild();    
				}
			}
		}
	};
}
测试:
oBtn.onclick=function(){
	ajax('123.txt',function(str){
		alert(str);
	},function(){
		alert('失败');
	})
};

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读