AJAX技术简介.doc

AJAX技术简介知识点：1、 基本概念AJAX Asynchronous JavaScript and XML 异步的Javascript和XML传统的WEB模型：同步模型必须是一次请求，一次响应。每次请求服务器（地址栏输入，点击超链接，提交表单），页面都会刷新。传统的WEB模型同步模型缺点：由于浏览器在向服务器发出请求之后，必须等待服务器给响应，有可能页面成为一片空白，客户体验不好。由于每次都要刷新整个页面，导致服务器的网络带宽被浪费。网站LOGO图片版权部分网站菜单分页数据下一页当翻页时整个页面都要刷新AJAX技术的WEB模型：异步模型可以连续发出多个请求给服务器，在随后不确定的时间里响应回来。我们有了一种新的请求服务器的方法（以前传统的浏览器请求服务器的方式：地址栏输入、点击超链接、提交表单），通过下图的Ajax Engine（引擎）。我们可以通过AJAX引擎发出多个请求，然后可以接收服务器的响应。此时可以不必刷新整个浏览器页面，就能更新页面的部分内容。AJAX技术优势：1、 传统模式每次请求页面都会刷新，这样比较占用服务器网络带宽。AJAX模式可以实现局部刷新，大大节约服务器网络带宽。2、 AJAX模式能很好的改善客户体验。2、 XMLHttpRequest使用Ajax Engine在浏览器中是一个对象，它的类型是：XMLHttpRequest1、创建XMLHttpRequest对象（它在不同浏览器中，创建方式不一样的；但是使用上是一样的）var xmlHttp = false;if (window.XMLHttpRequest) xmlHttp = new XMLHttpRequest();else if (window.ActiveXObject) tryxmlHttp = new ActiveXObject(Msxml2.XMLHTTP);catch(error1)tryxmlHttp = new ActiveXObject(Microsoft.XMLHTTP);catch(error2)xmlHttp = false;方法 属性 open() onreadystatechange setRequestHeader() status send() readyState getResponseHeader() statusText getAllResponseHeaders() responseText responseXML responseBody responseStream open初始化HTTP请求参数,语法(method, url, async, username, password)|method 指定请求方式,一般是GET、POST不区分大小写; url指定请求地址,大多数浏览器都限制在同域下要求url与请求页面具有相同的主机名和端口,可以为绝对地址也可以为相对地址; async指定请求是异步还是同步,默认是异步true则通常许指定一个onreadystatechange句柄用于异步回调,同步则指定为 false; username 和 password 参数是可选的及在请求的url需要授权时填写; setRequestHeader单独指定请求的某个http头,语法(headerStr,valueStr)|headerStr指定头名称,如果存在则覆盖 valueStr指定值此方法必须在open方法后调用 send发送请求到http服务器并接收回应,语法(varBody)|指定请求中发送的数据;此方法的同步或异步方式取决于open方法中的async参数,如果async = False,此方法将会等待请求完成或者超时时才会返回;如果async = True，此方法将立即返回。 getAllResponseHeaders获取响应的所有http头,语法()|每个http头名称和值用冒号分割，并以rn结束。当send方法完成后才可调用该方法。 getResponseHeader从响应信息中获取指定的http头,语法(headerStr)|headerStr指定头名称,当send方法成功后才可调用该方法; onreadystatechange当readyState属性改变时调用该属性指定的方法 status2*：操作成功收到，分析、接受200常用 |4*：客户端请求错误 |5*：服务器响应错误 statusTextstatusText属性和status属性的功能基本相同他们的区别在于status返回的是http状态码数字形式; 而statusText返回的是以文本形式返回http状态信息.比如在请求一个不存在的网页时status返回404, 而statusText则返回Not Found readyState 0 未初始化 还没有调用send()方法 1 载入 已调用send()方法，正在发送请求 2 载入完成 send()方法执行完成，已经接收到全部响应内容 3 交互 正在解析响应内容 4 完成 响应内容解析完成，可以在客户端调用了 responseText_responseXML_responseBody_responseStream responseText 将响应信息作为字符串返回;XMLHTTP默认将响应数据的编码定为UTF-8; responseXML 将响应信息格式化为Xml Document对象并返回;如果响应数据不是有效的XML文档，此属性本身不返回XMLDOMParseError，可以通过处理过的DOMDocument对象获取错误信息 responseBody 以unsigned array格式表示直接从服务器返回的未经解码的二进制数据 respo