Ajax(异步JavaScript和XML)不是一种编程语言,也不是一种新技术,主要由JavaScript,DOM,CSS,XMLHttpRequest四种技术有机组成。其中XMLHttpRequest是核心机制,它负责将客户端信息以异步通信的方式传递给服务器,并接收从服务器返回的信息和数据。它的优点是:减轻了服务器的负担,无需插件支持,使页面与数据分离。
下面谈一下异步交互机制,对Ajax来说,异步交互就是客户端与服务器进行交互时,只有部分数据与服务器交换。用户提供表单数据,只有表单数据递送给服务器,然后等待服务器的反馈,但除了表单之外的页面没有变化。
web中与服务器进行异步通信的是XMLHttpRequest对象。格式化代码:
<pre name="code" class="html">var xmlhttp;
function creatXMLHttpRequest(){ //判断浏览器创建Ajax对象
if(window.ActiveXObject){
xmlhttp=new XMLHttpRequest("Microsoft.XMLHTTP");
}else if(window.XMLHttpQuest){
xmlhttp=new XMLHttpRequest();
}
}
开始使用Ajax的简单Demo:
function dealStateChange(){ //一个服务器是否连接好并有返回值的测试函数
if(xmlhttp.readyState==4&&xmlhttp.status==200){
alert("服务器返回的值是:"+xmlhttp.responseText);
}
}
function test(){ //触发函数
creatXMLHttpRequest();
xmlhttp.open("POST","1.html",true);
xmlhttp.onReadyChange=delStateChange(); //作为一个回调函数存在
xmlhttp.send(null);
}
这是最初学习Ajax时写的JS代码,有没有人看出来里面的错误。里面的错误你要是不仔细琢磨,还真是找不出来。错误1、用的"POST"方法进行数据的传输,需要设置头信息----xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");在POST传送数据的方式下,如果传送中文,可能会出现乱码的情况,需要用两次encodeURL()方法,返回数据的时候再用decodeURL()方法解码;错误2、1.html是错误的,刚开始大意没发现,js的警告框始终无法弹出,最后才看到这一点,url提供的是处理数据的页面,即服务器端的页面地址,把地址给一个静态的html文档,是无法处理数据的。
还有一点注意的是open方法与send方法的顺序问题,按常人的思维,应该在浏览器与服务器建立连接好以后,进行数据的传输,这样就容易遗忘一件事,在建立连接后还要进行一个浏览器端与服务器端的状态的判断,这就是回调函数的作用,当判断状态为指定值,产生相应的响应,再去与服务器交换数据。
之前说的是通过一个全局Ajax对象来异步请求进行处理的,如果要处理多个请求,就可能发生请求上的冲突。解决的办法通常是将Ajax对象作为局部变量,并在收到服务器段返回数据以后,手动删除对象。例:delete xmlhttp。