ajax方法
ajax= 异步 JavaScript 和 XML,是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。有很多使用 AJAX 的应用程序案例:新浪微博、Google 地图、开心网等等。
ajax的核心
1、建立XMLHtppResquest对象
此处要注意有兼容性问题(对IE7及以下浏览器写法有不同),实现代码如下:
<script>
var xmlHttp;
if(window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest();
}else{
//对IE7及以下版本浏览器做兼容
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
</script>
2、通过open方法建立连接,发送请求及参数
此处用到ajax的一些方法。其实主要是open()方法。请求分为"GET"与"POST"两种形式。"GET"用来获取服务器返回的一些参数,而"POST"方法则允许用户修改服务器上的一些数据。
<script>
/*
*open方法解释
*建立请求 共三个参数
*第一个参数:使用的方法,GET or POST
*第二个参数:url地址
*第三个参数:同步方式 or 异步方式,一般置为true,为异步;默认也为异步调用
*/
request.open("GET","changge",true);
/*
*send方法解释
*发送参数,一般针对于POST方法。使用GET方法时,此参数传null或不传值
*/
request.send(null);
</script>
对服务器返回的状态进行判断,若成功,则拿到数据,进行后续的事宜。这里主要是对request.readyState和request.status两个属性进行判断。
request.readyState:状态码属性,枚举如下:
0:请求未初始化,open还没有调用
1:服务器连接已建立,open已调用
2:请求已接收,即收到头信息了
3:请求处理中,即接收到响应主体了
4:请求已完成,且响应已就绪,即响应完成了
request.status:状态值,比较多,例如:404 Not Found,400 请求出现语法错误。
<script>
request.onreadystatechange = function() {
if (request.readyState==4) {//请求完成
if (request.status==200) { //OK 一切正常
var data = JSON.parse(<span style="font-family: Arial, Helvetica, sans-serif;">'</span><span style="font-family: Arial, Helvetica, sans-serif;">(</span><span style="font-family: Arial, Helvetica, sans-serif;">'</span><span style="font-family: Arial, Helvetica, sans-serif;">request.responseText</span><span style="font-family: Arial, Helvetica, sans-serif;">)</span>);//将返回的数据放在data变量中
if (data.success) {
document.getElementById("XXX").innerHTML = data.msg;
} else {
document.getElementById("XXX").innerHTML = "出现错误:" + data.msg;
}
} else {
alert("发生错误ÿ