您现在的位置:首页 >> 前端 >> 内容

如何编写一个ajax?

时间:2017/8/11 9:46:00 点击: 30

  核心提示:1.创建Ajax对象***这里要注意IE的兼容问题var oAjax=null;if(window.XMLHttpRequest){ oAjax=new XMLHttpRequest(); }els...

1.创建Ajax对象

***这里要注意IE的兼容问题

var oAjax=null;
if(window.XMLHttpRequest){
		oAjax=new XMLHttpRequest();
	}else{
		oAjax=new ActiveXObject("Microsoft.XMLHTTP");
	}

2.连接服务器:obj.open(传输方法, url, 传输方式)

oAjax.open('GET', url, true);
传输方法(Method):有get方法和post方法。 url:就是地址 传输方式(async):true/false;
当async为true时,服务器请求是异步进行的,也就是脚本执行send()方法后不等待服务器的执行结果,而是继续执行脚本代码;当async为false时,服务器请求是同步进行的,也就是脚本执行send()方法后等待服务器的执行结果的返回,若在等待过程中超时,则不再等待,继续执行后面的脚本代码!

其中,get方法和post方法区别:

get是从服务器上获取数据,post是向服务器传送数据。 get是把参数数据队列加到提交表单的ACTION属性所指的URL中,值和表单内各个字段一一对应,在URL中可以看到。post是通过HTTP post机制,将表单内各个字段与其内容放置在HTML HEADER内一起传送到ACTION属性所指的URL地址。用户看不到这个过程。对于get方式,服务器端用Request.QueryString获取变量的值,对于post方式,服务器端用Request.Form获取提交的数据。get传送的数据量较小,不能大于2KB。post传送的数据量较大,一般被默认为不受限制。但理论上,IIS4中最大量为80KB,IIS5中为100KB。get安全性非常低,post安全性较高。但是get方法执行效率却比Post方法好。

3.发送请求:obj.send()

4.接收服务器的返回:obj.onreadystatechange()

当请求被发送到服务器时,我们需要执行一些基于响应的任务。 每当 readyState 改变时,就会触发 onreadystatechange 事件。 readyState 属性存有 XMLHttpRequest 的状态信息。
onreadystatechange 存储函数(或函数名),每当 readyState 属性改变时,就会调用该函数。 readyState 存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。 0: 请求未初始化1:服务器连接已建立2: 请求已接收3: 请求处理中4: 请求已完成,且响应已就绪 status:状态码
1xx:请求收到,继续处理2xx:操作成功收到,分析、接受3xx:完成此请求必须进一步处理4xx:请求包含一个错误语法或不能完成5xx:服务器执行一个完全有效请求失败 比较常见的状态码: 200: OK 一切正常,对GET和POST请求的应答文档跟在后面404:没有发现文件、查询或URl
oAjax.onreadystatechange=function ()
	{
		if(oAjax.readyState==4)	//完成
		{
			if(oAjax.status==200)	//成功
			{
				fnSucc(oAjax.responseText);
			}
			else
			{
				if(fnFaild)
					fnFaild(oAjax.status);
			}
		}
	};
好啦 以上就是ajax的全过程了

作者:网络 来源:xzh97的博客
惊讶 欠揍 支持 很棒 愤怒 搞笑 恶心 不解