Ajax访问后台服务器

Ajax访问后台服务器目录Part01教学目标Part02教学内容ContentsPart03教学总结Part01教学目标教学目标知识目标Ajax访问后台服务器01能力目标理解Ajax访问后台服务器02Part02教学内容1.Ajax访问后台服务器第一步：创建XMLHttpRequest对象第二步：建立到服务器的连接第三步：指定回调函数第四步：发送请求2.创建XMLHttpRequest对象第一步：创建XMLHttpRequest对象不同浏览器创建方式不同可以提取为方法供调用functioncreateXMLHttpRequest(){if(window.ActiveXObject){//IE xhr=newActiveXObject("Microsoft.XMLHTTP");}else{//其他浏览器 xhr=newXMLHttpRequest();}}属性readyState：提供当前HTML的就绪状态status：服务器响应的状态代码responseText/responseXML：服务器返回的请求响应文本/XML方法open()：建立到服务器的新请求send()：向服务器发送请求setRequestHeader(）设定请求头信息事件onreadystatechange:用于指定回调函数2.创建XMLHttpRequest对象XMLHttpRequest对象，是Ajax应用的核。3.建立到服务器的连接使用XMLHttpRequest

对象的open()方法来建立请求。参数如下：request-type：发送请求的类型。典型的值是GET

或POST。url：要连接的URLasynch：如果希望使用异步连接则为true，否则为false。默认为true。username：如果需要身份验证，则可以在此指定用户名。password：如果需要身份验证，则可以在此指定口令。通常使用其中的前三个参数或前两个参数即可。第二步：建立到服务器的连接xmlHttp.open("GET",“exmp1.jsp",true);xmlHttp.open(“POST,“exmp1.jsp");xmlHttp.open("GET","examp1.jsp?"+newDate().getTime(),true);4.指定回调函数functionprocess(){if(xhr.readyState==4){//200404500if(xhr.status==200){//得到返回的结果varresult=xhr.responseText;//写到指定位置document.getElementById("namemsg").innerHTML=result;}else{alert("Ajax请求错误");}}}第三步：指定回调函数Ajax响应回来后自动调用函数不同的Ajax请求基本步骤相同，差别和难易主要在回调函数5.HTTP状态HTTP就绪状态，表示请求的状态或情形在Ajax应用程序中，需要了解五种就绪状态，但通常只使用状态4种0：请求没有发出。在调用open()之前。1：请求已经建立但还没有发出。在调用send()之前。2：请求已经发出正在处理之中这里通常可以从响应得到内容头部3：请求已经处理，响应中有部分数据可用，但服务器还没有完成响应4：响应已完成，可以访问服务器响应并使用它状态码status200404返回结果数据responseTextresponseXML6.发送请求第四步：发送请求xmlHttp.send(null);//getxmlHttp.send(queryString);//post注意事项如果是get请求，参数已经附加在url中，采用send(null)即可。如果是post请求，需要通过