javascript和jQuery中的AJAX技术详解【包含AJAX各种跨域技术】

本文实例讲述了javascript和 jQuery中的AJAX技术。分享给大家供大家参考，具体如下：

1.什么是AJAX？

AJAX即“Asynchronous Javascript And XML”（异步JavaScript和XML），是指一种创建交互式网页应用的网页开发技术。

通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

传统的网页（不使用 AJAX）如果需要更新内容，必须重载整个网页页面。

2.AJAX在原生JS中的实现

尽管随着JS框架的盛行，在jQuery中，实现AJAX过程相当简单，但是对于一些不需要加载jQuery这种庞大插件的项目中，还是要采用AJAX的原生实现！

要实现原生JS的AJAX过程，对于高版本浏览器，支持JS中的XMLHttpRequest对象，而低版本的浏览器IE6，IE7不兼容，因此要使用ActiveXObject()对象来实现，兼容各种版本的XMLHttpRequest对象的构建如下：

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

对于XMLHttpRequest对象有很多种方法，

（1）xml.readyState：表示请求的状态其中xml.readyState=0表示请求的准备阶段，xml.readyState=1,表示开始发送请求，xml.readyState=2表示服务器已经接收到请求，xml.readyState=3表示服务器正在处理请求，xml.readyState=4表示服务器处理完请求，并将请求返回到客户端。

0 － （未初始化）还没有调用send()方法
1 － （载入）已调用send()方法，正在发送请求
2 － （载入完成）send()方法执行完成，已经接收到全部响应内容
3 － （交互）正在解析响应内容
4 － （完成）响应内容解析完成，可以在客户端调用了

（2）xml.status：表示请求过程中的状态说明，

1xx信息提示：

这些状态代码表示临时的响应。客户端在收到常规响应之前，应准备接收一个或多个 1xx 响应。

2XX表示成功，

3XX重定向

客户端浏览器必须采取更多操作来实现请求。例如，浏览器可能不得不请求服务器上的不同的页面，或通过代理服务器重复该请求。

4xx客户端错误

发生错误，客户端似乎有问题。例如，客户端请求不存在的页面，客户端未提供有效的身份验证信息。

5XX服务器错误

服务器由于遇到错误而不能完成该请求。

（3）用原生JS，实现AJAX中的get请求：

 var xml=new XMLhttpRequest(); xml.onreadystatechange=function(){ if(xml.readyState==4&&xml.status==200) { var data=JSON.parse(xml.responseText); } else{ alert("请求失败"); } } xml.open("get","url","true");//url里面为请求的地址，true表示异步请求 xml.send(null) 

（4） 用原生JS实现post请求：

 var xml=new XMLhttpRequest(); xml.onreadystatechange=function(){ if(xml.readyState==4&&xml.status==200) { var data=JSON.parse(xml.responseText); } else{ alert("请求失败"); } } xml.open("post","url","true");//url里面为请求的地址，true表示异步请求 xml.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); //设置post请求的请求头 xml.send(null) 

为什么要设置请求头信息：

默认情况下，Ajax以content-type:text/plain,方式来提交数据，此时服务器将忽略post实体部分的数据，所以服务器无法获得post请求中的数据。

解决方法：

 Content-Type: application/x-www-form-urlencoded 

3.AJAX中的跨域技术

（1）.跨域的方式有首先是代理访问。这个方法可以跨域访问JS等文件，比如说