MS_WEB开发框架技术3Ajax.ppt

Ajax的特点 AJAX = 异步 JavaScript和XML（标准通用标记语言的子集）。 AJAX 是一种用于创建快速动态网页的技术。 通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。而传统的网页要更新内容时，必须重载整个网页页面。 Ajax的应用优势 AJAX不是一种新编程语言，而是一种用于创建更好更快以及交互性更强的Web应用程序的技术。 AJAX 在浏览器与 Web 服务器之间使用异步数据传输（HTTP 请求），使网页从服务器请求少量的信息，而不是整个页面。 AJAX 可使因特网应用程序更小、更快，更友好。 Ajax 的核心技术 Ajax 的核心是 JavaScript 对象 Xml-HttpRequest。它在 IE 5 中首次引入，是一种支持异步请求的技术。XmlHttpRequest 使您可以使用 JavaScript 向服务器提出请求并处理响应，在不重载页面的情况与Web服务器交换数据，而不阻塞用户。 Ajax发展简史 1998年，允许客户端脚本发送HTTP请求的第一个组件由Outlook Web Access小组写成。该组件属于微软Exchange Server，它很快成为了IE 4.0的一部分。有人认为，Outlook Web Access是第一个成功应用了Ajax技术的商业应用程序，并成为包括Oddpost的网络邮件产品在内的许多产品的领头羊。到2005年初，Ajax逐步被大众所认识。 Ajax应用简史（续） 而AJAX近几年掀起的应用高潮，则要完全归功于Google在Google Suggest和Google Maps中的使用。术语Ajax由《Ajax: A New Approach to Web Applications》一文所创，该文的迅速流传提高了人们使用该项技术的意识。Google在它著名的交互应用程序中使用了AJAX异步通讯，如Google讨论组、Gmail、Google地图、Google建议等。另外，对Mozilla/Gecko的支持使得该技术走向成熟，变得更为易用，成为网站开发的常用主流技术。 Ajax与非Ajax应用模型对比 从上面两张图可以看出，对于每个用户的行为，在传统的Web应用模型中，将生成一次HTTP请求；而在Ajax应用开发模型中，将变成对Ajax引擎的一次JavaScript调用。 Ajax应用开发模型通过JavaScript实现在不刷新整个页面的情况下，对部分数据进行更新，从而降低网络流量，加快显示更新速度，带来更好的用户体验。 Ajax包含的几种技术 Ajax（Asynchronous JavaScript + XML）的定义； 基于web标准（standards-based presentation）XHTML+CSS的表示； 使用 DOM（Document Object Model）进行动态显示及交互； 使用 XML 和 XSLT 进行数据交换及相关操作； 使用 XMLHttpRequest 进行异步数据查询、检索； 使用 JavaScript 将所有的东西绑定在一起。 ScriptManager控件位置图 例子3.1 通过ScriptManager控件引用自定义脚本文件 通过ScriptManager控件的Script标记引用自定义的上网脚本文件MyScript.js，以检测用户在文本框中输入的是否为汉字。脚本文件MyScript.js的内容参见下页。 MyScript.js文件的内容 例子3.1的运行结果 本例通过引用一个现成的Web Services软件RandomService.asmx来生成一个随机数，默认的主页程序Default.aspx上有提示“随机数为：”，并有一个Label控件，下部有获取随机数的按钮。每当点击按钮时，就调用Web服务获取一个新的随机数并在Label控件中显示出来（范围在12~17之间）。 现有的Web Services文件RandomService.asmx 主页程序Default.aspx的内容 Default.aspx的后台代码 例子3.2 的运行结果 UpdatePanel控件的Triggers属性 UpdatePanel控件的Triggers包括两种触发器： AsyncPostBackTrigger：用于引发页面的局部更新 PostBackTrigger：用于引发页面的整体回送 当页面中使用多个UpdatePanel控件时，通过设置其UpdateMode属性为Conditional，可以避免他们之间的相互影响。 UpdatePanel控件的Triggers属性 Triggers的属性设置 例子3.3 使用更新控件实现局部更新 本例