什么是AJAX？3、它的全称是AsynchronousJavaScriptandXML（翻译过来就是异步JavaScript和XML）4、它是一种前后端通信技术，不是一种语言。这种技术可以在不刷新页面的情况下从服务器获取数据，也就是说可以在不加载整个网页的情况下进行局部刷新，用户体验非常好。AJAX的原理是什么？10、简单来说就是通过XMLHttpRequest对象向服务器发送异步请求，从服务器获取数据，然后用js操作dom来更新页面。最关键也是最重要的一步是从服务器获取请求数据，所以我们先来了解一下XMLHttpRequestAjax的应用场景16.页面拉取加载更多数据17.列出数据，不刷新分页18.表单项离开重点数据校验19.搜索框提示文字下拉列表XMLHttpRequest是ajax的核心机制。先说说它的属性和方法：1.readyState属性状态：0未初始化1准备发送2已发送但尚未收到响应3正在接受4接受并完成2.responseText属性服务器响应文本内容结合readyState属性：当readyState=4时，responseText包含完整的响应信息；当readyState=3时，responseText包含不完整的响应信息；当readyState<3时，responseText为空String3.responseXML属性服务器响应的XML内容对应的DOM对象4.status属性（服务器返回的http状态码）和statusText属性（状态码的文本信息）41.status=200success42.status=404notFound43.status=500serverinternalerror5.onreadystatechange事件该事件在readyState属性改变时触发，用于触发回调函数onreadystatechange是一个事件句柄。它的值（state_Change）是一个函数的名字，当XMLHttpRequest对象的状态改变时这个函数被触发。状态从0变为4。只有当状态为4时，我们才执行代码。6.open()方法open(method,url,async,username,password)method:mustSubmitmethodGET/POST/PUT...必须大写url:请求的服务器地址async:布尔值，表示是否使用异步方式，默认为true异步，false为同步用户名，密码可以不指定，分别提供http认证机制需要的用户名和密码。7.send()方法send(content)content可以指定为null表示没有发送数据，其内容可以是一个DOM对象。输入流或字符串调用open方法后，可以调用send()方法向服务器发送请求。当asyncinopen为true时，send()方法调用后会立即返回8.setRequestHeader()方法setRequestHeader(header,value)用于设置请求的指定头信息，该方法需要在请求后调用open()方法，否则会得到异常。一般在Post方法中使用9.getResponseHeader()方法。当readyState>2时，该方法用于获取响应的头信息，否则返回空字符串。getAllResponseHeaders()方法返回所有HttpResponseheadersPart信息10.abort()方法停止当前的http请求。相应的XMLHttpRequest对象将被重置为未初始化状态。AJAX的基本步骤：1.创建一个XMLHttpRequest对象>varxhr=null;>if(window.XMLHttpRequest){//如果window下有这个属性，直接使用>xhr=newXMLHttpRequest()//浏览otherthanIE5IE6XMLHttpRequestisasub-objectofwindow>}else{//IE5IE6以ActiveXObject的形式引入XMLHttpRequest对象>xhr=newActiveXObject("Microsoft.XMLHTTP")//旧版IE，ie6和below>}`2.Bind事件监听函数varxhr=null;if(window.XMLHttpRequest){//如果window下有这个属性，使用xhr=newXMLHttpRequest()//IE5、IE6以外的浏览器XMLHttpRequest是window的子对象}else{//IE5IE6引入ActiveXObject形式的XMLHttpRequest对象xhr=newActiveXObject("Microsoft.XMLHTTP")//IE旧版本，ie6及以下}3.建立连接xhr.open("GET","02.json",true);//请求方式为get，请求的服务器地址为02.json，异步4.发送消息请求//4.发送消息请求//xhr.send(已发送参数)xhr.发送（空）；Ajax运行原理及实现Ajax运行原理Ajax相当于浏览器发送请求和接收响应的代理，从而在不影响用户浏览页面的情况下实现页面数据的局部更新，从而提高用户体验。服务端响应的数据格式在实际项目中，服务端多数情况下会使用JSON对象作为响应数据的格式。客户端拿到响应数据后，需要将JSON数据和HTML字符串进行拼接，然后将拼接后的结果显示在页面上。在http请求和响应过程中，无论是请求参数还是响应内容，如果是对象类型，最终都会转化为对象字符串进行传输。JSON.parse()//将json字符串转为json对象请求参数传传统网站表单提交GET请求方式xhr。open('get','http://www.example.com?name=zhangsan&age=20');POST请求方法xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded')xhr.send('name=zhangsan&age=20');HTTP请求和响应过程中请求消息传输的数据块称为消息，包括要传输的数据和一些附加信息，必须符合规定的良好格式。请求参数格式application/x-www-form-urlencodedname=zhangsan&age=20&sex=maleapplication/json{name:'zhangsan',age:'20',sex:'male'}指定Content-Typein请求头属性的值为application/json，告诉服务器当前请求参数的格式为json。JSON.stringify()//将json对象转为json字符串注意：get请求不能提交json对象数据格式，传统网站的表单提交不支持json对象数据格式。获取服务端响应ajax状态码创建ajax对象，配置ajax对象，发送请求，接收服务端响应数据，这个过程的每一步都会对应一个值，就是ajax状态码.0：请求还没有初始化（还没有调用open()）1：请求已经建立，但是还没有发送（还没有调用send()）2：请求已经发送了3:正在处理请求，通常响应中已经有一些数据准备使用4:响应已经完成，可以获取并使用服务器的响应xhr.readyState//获取Ajax状态码onreadystatechangeevent这个事件会当Ajax状态代码更改时自动触发。在事件处理函数中，可以获取并判断Ajax状态码。当状态码为4时，可以通过xhr.responseText获取服务端响应数据。//当Ajax状态码发生变化时xhr.onreadystatechange=function(){//判断Ajax状态码何时为4if(xhr.readyState==4){//从服务端获取响应数据console.log(xhr.responseText);}}两种获取服务端响应的区别Ajax错误处理网络畅通，服务端能收到请求，服务端返回的结果不是预期的结果。服务器返回的状态码可以单独判断处理。xhr.status获取http状态码，网络通畅，但服务器收不到请求，返回404状态码。检查请求地址是否有误。网络畅通，服务器可以接收请求，服务器返回500状态码。服务器端错误，找后端程序员沟通。网络中断，请求无法发送到服务器。xhr对象下的onerror事件会被触发，错误会在onerror事件处理器中处理。低版本IE浏览器的缓存问题：在低版本IE浏览器中，Ajax请求存在严重的缓存问题，即在请求地址不变的情况下，实际上只有第一个请求会发送到服务器。后续请求将从浏览器的缓存中获取结果。即使服务器端的数据更新了，客户端还是拿到了缓存中的旧数据。解决方法：在请求地址后面加上请求参数，保证每次请求中请求参数的值是不同的。xhr.open('get','http://www.example.com?t='+Math.random());Ajax异步编程Ajax封装问题：一次发送太多请求代码，重复发送多个请求代码冗余。解决方法：将请求代码封装成一个函数，发送请求时调用该函数即可。ajax({type:'get',url:'http://www.example.com',success:function(data){console.log(data);}})*$.ajax使用[AJAX——核心XMLHttpRequest对象](http://blog.csdn.net/liujiahan629629/article/details/17126727)，而且JQuery也封装了Ajax异步操作，这里介绍一些常用的方法。$.ajax、$.post、$.get、$.getJSON。首先，$.ajax是jQuery对ajax封装的最基本的一步。使用该函数可以完成异步通信的所有功能。也就是说，我们在任何情况下都可以通过这个方法进行异步刷新操作。但是它的参数很多，有时候可能会比较麻烦。看一下常用参数：varconfigObj={method//数据提交方式：get和posturl//数据提交路径async//支持异步刷新，默认为truedata//需要提交的数据dataType//服务器返回的数据类型，如xml、String、Json等success//请求成功后的回调函数error//请求失败后的回调函数}$.ajax(configObj);//通过$.ajax函数。异步删除示例：1.//删除2.$.ajax({3.Type:"Post",//提交方式4.URL:"${PageContext.Request.ContextPath}/org/dodelete.Action",//路径5.Data:{6."org.id":"${org.id}"7.},//数据，这里是json格式传输8.SUCCESS:**Function**(result){//根据result处理返回的数据9.**if**(result.success){10.$("#tipMsg").text("删除数据成功");11.tree.deleteItem("${org.id}",**true**);12.}**else**{13.$("#tipMsg").text("删除数据失败");14.}15.}16.});1~~~~7。其次，$.post函数其实是对$.ajax的进一步封装，减少了参数，简化了操作，但使用范围更小。$.post简化了数据提交方式，只能通过POST方式提交。服务器只能异步访问，不能同步访问，不能处理错误。在这些条件下，我们就可以使用这个函数来方便我们的编程。它的主要参数，如method、async等，都是默认设置的，我们无法更改。url：发送请求地址。data：要发送的键/值参数。callback：发送成功时的回调函数。type：返回内容格式，xml，html，script，json，text，_default。第三，$.get与$.post相同。该函数封装了get方法提交的数据。只能用在获取提交数据的方法中，解决异步刷新。使用方法同上。第四，$.getJSON是进一步的封装，即把返回的数据类型作为Json进行操作。里面只有三个参数，我们需要设置，很简单：url，[data]，[callback]。在常规表单的处理中，我们使用框架Struts2通过领域驱动的方式自动获取封装，那么如何通过ajax进行封装呢？这里JQuery有一个插件，JqueryForm，通过引入这个js文件，我们可以模仿表单Form来支持Struts2的领域驱动模式，进行自动数据封装。~~~~
