AJAX基础：从概念到应用全面.pptxVIP

AJAX

本节主要目标什么是AJAXAJAX的应用XMLHTTP协议XMLHttpRequest对象AJAX中的文本GET/POST操作AJAX中的XML的POST操作AJAX中的编码解决

走进AJAX使用XHTML和CSS的基于标准的表示技术使用DOM进行动态显示和交互使用XML和XSLT进行数据交换和处理使用XMLHttpRequest进行异步数据检索使用Javascript将以上技术融合在一起

AJAX基础及定义AJAX（AsynchronousJavaScriptandXML）其实是多种技术的综合，包括Javascript,XHTML和CSSDOMXML和XSTLXMLHttpRequest。其使用XHTML和CSS标准化呈现，使用DOM实现动态显示和交互，使用XML和XSTL进行数据交换与处理，使用XMLHttpRequest对象进行异步数据读Javascript绑定和处理所有数据。

传统WEB交互过程

AJAX交互过程

AJAX技术核心XMLHttpRequest对象DOM与HTMLDOM与XML面向对象的Javascript

AJAX技术核心AsynchronousXMLHttpRequest 最早是在IE5.0中以ActiveX组件的形式出现的 后来Mozilla，Safari，Opera等浏览器厂商都支持了XMLHttpRequest由于XMLHttpRequest并不是W3C的标准，因此在各个浏览器的实现上也有所不同。IE“独树一帜”，仍然是以ActiveX组件的方式来创建XMLHttpRequest对象其他浏览器则可以直接创建javascript的XMLHttpRequest对象。

XmlHttp协议XmlHttp是一套可以在Javascript、VbScript、Jscript等脚本语言中通过http协议传送或从接收XML及其他数据的一套API。XmlHttp最大的用处是可以更新网页的部分内容而不需要刷新整个页面。

创建XmlHttp对象scriptlanguage=javascriptvarxmlHttp; functioncreateHttpRequest(){if(window.ActiveXObject){xmlHttp=newActiveXObject(Microsoft.XMLHTTP);}elseif(window.XMLHttpRequest){ xmlHttp=newXMLHttpRequest();}} /script

XMLHTTP的属性readyState：返回XMLHTTP请求的当前状态未初始化====0正在加载====1已加载====2交互中====3完成====4onreadystatechange：指定当readyState属性改变时的事件处理句柄(事件处理方法)responseText：将响应信息作为字符串返回responseXML：将响应信息格式化为XmlDocument对象并返回status：返回当前请求的http状态码。

XMLHttp常用方法abort：取消当前请求。getAllResponseHeaders获取响应的所有http头getResponseHeader从响应信息中获取指定的http头open：创建一个新的http请求，并指定此请求的方法send：发送请求到http服务器并接收回应setRequestHeader：单独指定请求的某个http头(设置请求头部请求消息。主要用于POST请求)

Open方法XMLHttpRequest.open(method,url,varAsync,user,password);method：http方法，例如：POST、GET、PUT及PROPFIND。大小写不敏感。url：请求的URL地址，可以为绝对地址也可以相对地址。varAsync[可选]:布尔型，指定此请求是否为异步方式，默认为true。如果为真，当状态改变时会调用onreadystatechange属性指定的回调函数。user[可选]：如果服务器需要验证，此处指定用户名，如果未指定当服务器需要验证时，会弹出验证窗口。password[可选]：验证信息中的密码部分，如果用户名为空，则此值将被忽略

AJAX的示例异步检测用户名

客户端发送文本客户端发送文本数据varurl=“testServlet?username=+username+date=+newDate();http.open(GET,url,true);http.onreadystatec