AJAX教程--董伟专.ppt

作者：董伟专 手机 QQ今天的课题 AJAX简介 XMLHttpRequest对象 数据格式 实现基本的Ajax技术 AJAX简介 AJAX全称为“Asynchronous JavaScript and XML”（异步JavaScript和XML），是一种创建交互式网页应用的网页开发技术。它使用：使用XHTML+CSS来表示信息； 使用Javascript操作Document Object Model进行动态显示及交互； 使用 XML 和 XSLT 进行数据交换及相关操作； 使用 XMLHttpRequest对象与Web服务器进行异步数据交换； 使用 JavaScript 将所有的东西绑定在一起。 与传统的web应用比较 不用刷新整个页面便可与服务器通讯的办法 Flash Java applet 框架：如果使用一组框架构造了一个网页，可以只更新其中一个框架，而不必惊动整个页面 隐藏的iframe XMLHttpRequest：该对象是对 JavaScript 的一个扩展，可使网页与服务器进行通信。是创建 Ajax 应用的最佳选择。实际上通常把 Ajax 当成 XMLHttpRequest 对象的代名词 Ajax工具包 “Ajax并不是一项技术，它实际上是几种技术，每种技术各尽其职，以一种全新的方式聚合在一起” 服务器端语言：服务器需要具备向浏览器发送特定信息的能力。Ajax与服务器端语言无关。 XML (eXtensible Markup Language，可扩展标记语言) 是一种描述数据的格式。Aajx 程序需要某种格式化的格式来在服务器和客户端之间传递信息，但 XML 只是其中的一种选择 XHTML（eXtended Hypertext Markup Language,使用扩展超媒体标记语言）和 CSS（Cascading Style Sheet,级联样式单）标准化呈现； DOM（Document Object Model,文档对象模型）实现动态显示和交互； 使用XMLHTTP组件XMLHttpRequest对象进行异步数据读取； 使用JavaScript绑定和处理所有数据。 Ajax的工作原理图 Ajax的缺陷 AJAX不是完美的技术。使用AJAX，它的一些缺陷不得不权衡一下： 由Javascript和AJAX引擎导致的浏览器的兼容 页面局部刷新，导致后退等功能失效。 对流媒体的支持没有FLASH、Java Applet好。 一些手持设备（如手机、PDA等）支持性差。 小结 Ajax并非是一个新的技术或者语言，他只是几项技术按一定的方式组合起来，在共同协作中发挥各自的作用。老技术，新技巧。 Ajax主要功能特点： JavaScript用户体验； CSS样式定义； DOM组织视图； XML数据异步加载； XMLDocument/XMLHttpRequest。 XMLHttpRequest对象 XMLHttpRequest对象的概述 XMLHttpRequest对象的方法和属性 XMLHttpRequest对象发送请求基本步骤 Ajax简单请求示例 javascript的两项强大性能 AJAX (异步 javascript 和 XML) 是个新产生的术语,专为描述javascript的两项强大性能.这两项性能在多年来一直被网络开发者所忽略,直到最近Gmail, Google suggest和google Maps的横空出世才使人们开始意识到其重要性. 这两项被忽视的性能是: (1)无需重新装载整个页面便能向服务器发送请求. (2)对XML文档的解析和处理 向服务器发送请求 XMLHttpRequest的概述 XMLHttpRequest最早是在IE5中以ActiveX组件的形式实现的。非W3C标准. 创建XMLHttpRequest对象（由于非标准所以实现方法不统一） (1) Internet Explorer把XMLHttpRequest实现为一个ActiveX对象。 (2)其他浏览器（Firefox、Safari、Opera…）把它实现为一个本地的JavaScript对象。 (3) XMLHttpRequest在不同浏览器上的实现是兼容的，所以可以用同样的方式访问XMLHttpRequest实例的属性和方法，而不论这个实例创建的方法是什么。 创建XMLHttpRequest对象 var xmlHttp; function createXMLHttpRequest() { if (window.ActiveXObject) { xmlHttp = new ActiveXObject(Microsof