ajax和ajax中json的处理
今天我们来谈论一下ajax和ajax相关的ajax中的json处理方案。
首先我们来谈一下ajax是什么？
ajax的全称是：“Asynchronous Javascript And XML”（异步（Asynchronous）的javascript和xml。）
ajax中的MvcHtmlRequest对象的创建方法：
xmvhttprequest对象该对象允许以异步的方式从服务器端获取数据和向服务器端发送请求，且该对象是大部分浏览器对支持的对象，我们可以通过 javascript对象来创建该对象，该对象也是ajax的核心对象，并且传输数据可是任何格式的，且该对象并不是w3c的标准，我们可以根据浏览器的 版本不同采用多种方式创建该对象，比如IE5和IE6的版本下：该对象的创建的语法：MvcHttpRquest=new MvcHttpReuqest（“Microsoft.XMLHTTP”）;
而IE7以及以上的版本和其他相关的现代浏览器，比如火狐，谷歌等主流浏览器使用的都是相同的创建语句：
但是大家都知道，用户使用的浏览器都是不具有不确定性的，比如一下用户使用的IE6和IE5和一些其他的浏览器，所有我们在书写代码的时候需要进行一个用户使用的浏览器的一个判断，代码如下：
同样我们也可以是window的另外一个方法来进行判断，window.XmlHttpRequest来进行判断，并且在同一个项目中我们使用一个方法就可以了，下面我们来看看两种方式的区别
接下来我们来看一下XmlHttpRequest的方法和属性：
下表显示了XMLHttpRequest对象的一些常用的方法，其中描述部分介绍了这些方法的作用和意义。
|
方法 |
描述 |
|
abort() |
停止当前请求 |
|
getAllResponseHeaders() |
把HTTP请求的所有相应首部作为键/值对返回。 |
|
getResponseHeader("header") |
返回指定首部的串值。 |
|
open("method","url") |
建立对服务器的调用。method参数可以是GET、POST或PUT等；url参数可以是相对URL或绝对URL。这个方法还包括3个可选参数。 |
|
send(content) |
向服务器发送请求。 |
|
setRequestHeader("header","value") |
把指定首部设置为所提供的值，在设置任何首部之前必须先调用open()方法。 |
下面我们来更详细的看看这些方法的使用。
1. abort()方法
可以使用这个abort()方法来暂停与一个XMLHttpRequest对象相联系的HTTP请求，从而把该对象复位到未初始化状态。
2. open()方法
此方法用来和服务器之间建立连接。其完整的方法参数是open(string method，string uri，boolean asynch，string username，string password)，其中前两个参数是必要的，后面三个为可选参数。
method参数是必须提供的，用于指定用来发送请求的HTTP方法（GET，POST，PUT，DELETE或HEAD）。为了把数据发送到服务器，应该使用POST方法；为了从服务器端检索数据，应该使用GET方法。另外，uri参数用于指定XMLHttpRequest对象把请求发送到的服务器相应的URI。借助于window.document.baseURI属性，该uri被解析为一个绝对的URI。换句话说，如果使用相对的URI，它将使用与浏览器解析相对的URI一样的方式被解析。Asynch参数指定是否请求是异步的，缺省值为true。为了发送一个同步请求，需要把这个参数设置为false。但Ajax技术的最大优点是 调用，因此如果这个参数设置为false，则将失去使用XMLHttpRequest对象的意义。对于要求认证的服务器，可以提供可选的用户名和口令参数。在调用open()方法后，XMLHttpRequest对象把它的readyState属性设置为1（打开）并且把responseText、responseXML、status和statusText属性复位到它们的初始值。另外，它还复位请求头部。注意，如果调用open()方法并且此时readyState为4，则XMLHttpRequest对象将复位这些值。
3. send()方法
在通过调用open()方法准备好一个请求之后，需要把该请求发送到服务器。仅当readyState值为1时，才可以调用send()方法。否则的话，XMLHttpRequest对象将引发一个异常。该请求被使用提供给open()方法的参数发送到服务器。当asynch参数为true时，send()方法立即返回，从而允许其它客户端脚本处理继续。在调用send()方法后，XMLHttpRequest对象把readyState的值设置为2（发送）。当服务器响应时，在接收消息体之前，如果存在任何消息体的话，XMLHttpRequest对象将把readyState设置为3（正在接收中）。当请求完成加载时，它把readyState设置为4（已加载）。对于一个HEAD类型的请求，它将在把readyState值设置为3后再立即把它设置为4。
send()方法使用一个可选的参数，该参数可以包含可变类型的数据。典型地，使用它并通过POST方法把数据发送到服务器。另外，可以显式地使用null参数调用send()方法，这与不用参数调用它一样。对于大多数其它的数据类型，在调用send()方法之前，应该使用setRequestHeader()方法（见后面的解释）先设置Content-Type头部。如果在send(content)方法中的content参数的类型为string，那么，数据将被编码为UTF-8。如果数据是Document类型，那么将使用由data.xmlEncoding指定的编码串行化该数据。
注意，由于调用这个方法后就把请求发出去了，所以对于XMLHttpRequest对象的设置需要在调用这个方法之前来完成。另外，对于send()方法中的那个参数，虽然是可选的，但是最好在不需要发送数据的时候也不能省略这个参数，应该将其设置成null，否则将会在Firefox中有错误。
4. setRequestHeader("header","value")方法
该方法用来设置请求的头部信息。当readyState值为1时，可以在调用open()方法后调用这个方法。否则，将得到一个异常。
5. getResponseHeader("header")方法
该方法用于检索响应的头部值。仅当readyState值是3或4（换句话说，在响应头部可用以后）时，才可以调用这个方法；否则，该方法返回一个空字符串。
6. getAllResponseHeaders()方法
该方法以一个字符串形式返回所有的响应头部（每一个头部占单独的一行）。如果readyState的值不是3或4，则该方法返回null。
XmlHttpRequest的属性如下：
1. readyState属性
当XMLHttpRequest对象吧一个HTTP请求发送到服务器时将经历若干种状态。一直等待直到请求被处理，然后，它才接收一个响应。这样以来，脚本才正确响应各种状态，XMLHttpRequest对象暴露一个描述对象的当前状态的readyState属性，如下表所示：
|
readyState取值 |
描述 |
|
0 |
描述一种“未初始化”状态。此时，已经创建了一个XMLHttpRequest对象，但是还没有初始化。 |
|
1 |
描述一种“发送”状态。此时，代码已经调用了XMLHttpRequest open()方法并且XMLHttpRequest已经准备好把一个请求发送到服务器。 |
|
2 |
描述一种“发送”状态。此时，已经通过send()方法把一个请求发送到服务器端，但是还没有收到一个响应。 |
|
3 |
描述一种“正在接收”状态。此时，已经接收到HTTP响应头部信息，但是消息体部分还没有完全接收结束。 |
|
4 |
描述一种“已加载”状态。此时，响应已经被完全接收。 |
2. onreadystatechange属性
无论readyState值何时发生改变，XMLHttpRequest对象都会激发一个readystatechange事件。其中，onreadystatechange属性接收一个EventListener值，向该方法指示无论readyState值何时发生改变，该对象都将激活。
3. responseText属性
这个responseText属性包含客户端接收到的HTTP响应的文本内容。当readyState值为0、1或2时，responseText包含一个空字符串。当readyState值为3（正在接收）时，响应中包含客户端还未完成的响应信息。当readyState为4（已加载）时，该responseText包含完整的响应信息。
4. responseXML属性
此属性用于当接收到完整的HTTP响应时（readyState为4）描述XML响应；此时，Content-Type头部指定MIME（媒体）类型为text/xml，application/xml或以+xml结尾。如果Content-Type头部并不包含这些媒体类型之一，那么responseXML的值为null。无论何时，只要readyState值不为4，那么该responseXML的值也为null。
其实，这个responseXML属性值是一个文档接口类型的对象，用来描述被分析的文档。如果文档不能被分析（例如，如果文档不是良构的或不支持文档相应的字符编码），那么responseXML的值将为null。
5. status属性
这个属性描述了HTTP状态代码，而且其类型为short。而且，仅当readyState值为3（正在接收中）或4（已加载）时，这个status属性才可用。当readyState的值小于3时试图存取status的值将引发一个异常。例如：status等于200表示成功，404表示未找到资源。
6. statusText属性
这个属性描述了HTTP状态代码文本，并且仅当readyState值为3或4才可用。当readyState为其它值时试图存取statusText属性将引发一个异常。
下面我们来看看如何使用Ajax，在这里我们主要聊一聊如何处理get请求和post请求，对于返回文本我们聊一聊如何处理xml，和文本响应：
这里是如何发送get请求：
下面使用post方式来发送请求：
下面看一看，对于Xml的Ajax操作
这里是servlet中的代码：
这里是前端的代码：
（1）.处理get请求的方法
这里的代码和前面处理Html的代码并没有什么不同。
由于xml文件是一种相对html复杂的文件：在这里我们使用XmlDocument对象
该图是XmlDocument的一些常用方法：
下面是前端回调函数的具体代码
记下来我们来看一看，Ajax的Json，聊一聊我们为什么需要使用Json，它的好处是什么？
在Ajax中返回数据的可以是，返回字符串，返回Html和，返回List，但是在现在的大多数程序中使用都是返回Json的方法。下面我们来看看返回Json有什么好处？
json格式数据轻量啊，而且解析比较方便，你想想xml大把的标记，数据流量比较大，如果是list，这是一组对象。其依赖于web容器，只有通过相 应的页面在前置转发才能够正常输出数据，如果你直接返回json，无论js，还是其它的应用，只需要解析这堆字符串就可以了，模块之间耦合也降低了。json是一种数据格式，比xml要简洁.在ajax一般是json来传递数据。不需要其他支持文件，只要你遵守json的数据格式即可如 {"name":"admin","age":22} 。
既然说了Json的好处，我们肯定是需要在前台Html页面中来使用Json数据的，我们看一看如何通过JavaScript的方式来取出Json中的数据。我们就以上面的数据为例：
例如Json的返回数据如下：{"name":"admin","age":22}
function GetInfo(date){
//在这里采用循环的方式来输出Json中的数据
$.each(date,funciton(i,dom){
//这里可以根据Json中Key值来进行数据的输出
alert(dom.name);//输出姓名
alert(dom.age);//输出年龄
})
}
浙公网安备 33010602011771号