ajax学习

学习ajax，首先要了解同步和异步这两个概念，查了很多资料，我的理解是

同步是指客户端发送一个请求，必须等到该请求处理完成后，才能继续进行下一个操作。

异步则不用等到请求执行完，可以立刻马上继续下一个请求的发送处理。

大概的了解同步异步之后，说说ajax的原理，

ajax的原理：说白了，无非是客户端发送请求，然后获取服务端返回来的响应结果，完了，一句话。

但是，要真正的理解并运用ajax，就需要对ajax中的一些对象有所熟悉

XMLHttpRequest对象时ajax的核心，一切得从这个对象说起

创建这个对象

function CreateXmlHttp() {

    //非IE浏览器创建XMLHttpRequest对象
    if (window.XmlHttpRequest) {
        xmlhttp = new XmlHttpRequest();
    }

    IE浏览器创建XMLHttpRequest对象if (window.ActiveXObject) {
        try {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        catch (e) {
            try {
                xmlhttp = new ActiveXObject("msxml2.XMLHTTP");
            }
            catch (ex) { }
        }
    }
}

这里针对不同的搜索引擎，创建XMLhttprequest对象的方式也不一样

创建完之后，

得知道xmlhttprequest对象中的几个中方法和属性

重要的方法有

open("1","2","3");

	"1"的值是指向服务器提交数据的类型，有get和post

	"2"中放入的是一个URL地址和你要提交的初始参数

	"3"中的值是指定传输的方式（同步，异步），默认是true（异步）

这个方法比较关键

还有一个方法是

send();通过该方法来发送请求的

ajax中重要的属性有

onreadystatechange:xmlhttprequest对象状态发生改变时所触发的事件

responseText/xml:服务器返回的数值，可以是字符串和xml文件

status：从服务器返回的数字代码，比如常见的404（未找到）和200（已就绪）

readyState：对象状态值，4是表示完成了（数据接收完毕）

function ComeBack() {

    var data = document.getElementById("data").value;
    CreateXmlHttp();
    if (!xmlhttp) {
        alert("创建XMLhttp对象异常！");
        return false;
    }

    xmlhttp.open("POST",url,false);

    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4) {
            if (xmlhttp.status == 200) {
                alert(responseText);
            }
        }
    }
    xmlhttp.send();
}

以上就实现了一个ajax的过程，说简单点就是，客户端发送一个请求，然后等待结果，就ok了

当然开始的时候会觉得比较乱，，但到后面会接触到一个json的东西，就会发现更加的简单了.

选下面来说说json

json的使用需要导入一个jquery.js的文件到页面上

<script type="text/javascript" src="<%=path %>/admin/js/jquery-1.7.2.min.js"></script>

然后调用里面的一个方法

	get（url，function(result){},"json"）

	url为发送的地址，function为一个内部类，处理你接下来要干的事，result为服务端传过来的数据

	json为数据的格式（貌似不用管它的），

	类似的还有post(url，function(result){},"json");方法，使用和get一样，但是还是有点差别	的，自己去找点资料吧

			jQuery.get(url,function(result){
				//alert(result);
				if(result=="true"){
					//alert("可以登陆了");
					form.submit();
				}else if(result=="error"){
					alert("用户名或密码错误，请重新输入！");
				}else if(result=="fengting"){
					alert("该用户已经被封！")
				}
			},"json");

最后，说下ajax的优点和缺点：

我个人认为优点有

1.不用刷新页面就可以实现客户端与服务端之间的通信，这点给客户带来了很好的体验效果。

2.使用异步的发送方式，使得客户发送完一个请求后可以继续进行下一个的操作。

3.减轻了服务端的负担

缺点有：

1.支持ajax的搜索引擎方面显得比较薄弱

2.使用ajax不是很安全，会暴露很多的数据和服务器逻辑。

可能写的不是很全，但至少还是总结出来了，不足的地方希望大神给点意见，还有一点申明下，有些地方多少借鉴了下。。。

相关推荐