[JavaScript]学习笔记:AJAX

完整的AJAX包括三个部分:

1.创建XMLHttpRequest对象:

不考虑IE6以下版本的兼容性问题的话

var xmlhttp=new XMLHttpRequest();


需要考虑到兼容性的问题时:

	var xmlhttp;if (window.XMLHttpRequest){
	  // code for IE7+, Firefox, Chrome, Opera, Safari
	 xmlhttp=new XMLHttpRequest();
	}else{
	 // code for IE6, IE5
	  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}

2.发送请求:

分POST和GET两种方式:

POST:

	  var url = 'c.php';
	  xmlhttp.open("POST",url,true);
	  xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
	  xmlhttp.send("id="+id);
GET:

	  var url = 'c.php'+"?id="+id;
	  xmlhttp.open("GET",url,true);
	  xmlhttp.send();

附注:

xmlhttp.open("GET",url,true);
true表示代码会在send()调用后继续执行,而不等待服务端的响应。即是异步。

3.响应:

XMLHttpRequest对象中存在属性readyState,该属性表示了请求所处于的状态。当一个 XMLHttpRequest 初次创建时,该属性值为0,直到接收到完整的 HTTP 响应,这个值增加到 4。这些值所对应的状态为:

0: Uninitialized。     XMLHttpRequest 对象已创建或已被 abort() 方法重置

1: Loading。            初始化XMLHttpRequest对象,open() 方法已调用,建立服务器连接已建立,请求还没有被发送。

2: Loaded。             Send() 方法已调用,HTTP 请求已发送到 Web 服务器,请求已接收。未接收到响应。

3: Interactive。         所有响应头部都已经接收到。响应体开始接收但未完成。

4: Completed。       请求已完成,HTTP 响应已经完全接收。

状态发生变化时,readyState相应改变,并且触发事件onreadystatechange。状态4的情况下,请求完成,响应(服务器返回结果)就绪,此时就可以通过
XMLHttpRequest对象的responseText属性获取到这个返回结果。

伴随响应,服务器会返回一个HTTP状态消息,200为请求成功。常见错误状态:

404 Not Found:服务器无法找到被请求的页面。

500 Internal Server Error:请求未完成。服务器遇到不可预知的情况。通常是服务端代码错误。

其他状态参考http://www.w3school.com.cn/tags/html_ref_httpmessages.asp

xmlhttp.onreadystatechange=function(){
  if (xmlhttp.readyState==4 && xmlhttp.status==200){
    alert(xmlhttp.responseText);  //相应的结果处理函数
  }
}


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值