Ajax技术在网站设计中应用.docVIP

Ajax技术在网站设计中应用【摘要】随着互联网的飞速发展，网络访问需求日益剧增，传统的访问方式需要在服务器和客户端间频繁的交换数据，造成大量数据拥塞，每个交互过程导致现等待延迟情况，刷新又出现空白页面等。 【关键字】Ajax ，CSS，网络负载，网络应用 1、引言 Ajax是Asynchronous JavaScript and XML的缩写，它并不是一种全新的技术，而是一种对原有多种Web技术的重新组合。Ajax将XHTML技术和CSS技术作为基础呈现手法，运用DOM（文件对象模型）作为交互和动态显示的手法，同时以XML及XSLT作为数据传输载体工具，然后用XMLHttpRequest对象获取异步（Asynchronous）数据信息，最后在客户端用JavaScript脚本语言把以上的这一系列操作串联起来与服务器进行通讯交互。 2、Ajax的工作原理 传统B/S架构的Web应用模型的工作原理是浏览器向服务器端发送一个用户请求，服务器端接收到用户请求后访问相关系统数据库，并对请求和获得数据进行处理加工，完成工作后，由服务器端产生并发送一个应答，以Html的形式返回给客户端，客户端等待服务器端应答，并利用应答中的数据加载一个新的页面。而在完成这些步骤期间，浏览器端由于在等候加载一个新的页面会暂时产生一个空白页，这就使得当同步请求被服务器处理时，用户不能与Web页面进行交互，只能处于等待的状态，当网络阻塞时，这样的等待就会影响用户的体验。 3、Ajax的关键技术 （1） Xml HttpRequest对象。XmlHttpRequest对象是整个Ajax的灵魂，这是因为Ajax最鲜明的特点异步通信是由XmlHttpRequest对象来实现的。XmlHttpRequest是XmlHttp组件中的一个对象，它为开发人员提供了一系列属性与方法向服务器发送异步通信请求，同时负责接收服务器端异步请求所返回的数据。ajax应用开发人员根据XmlHttpRequest对象相应的状态属性值，来获悉请求所处的状态，并进一步进行回调函数处理。异步请求的特性解决了传统web应用同步访问所造成用户体验性差的弊端，不仅增强了用户体验同时降低了服务器端资源的浪费，节省了带宽。 （2） JavaScript。JavaScript是一种基于对象（Object）和事件驱动（Event Driven）的客户端脚本语言。一方面，JavaScript脚本通过调用同时它还是一种解释性语言，也就是在执行其脚本之前无需提前对脚本进行编译，在脚本运行的过程当中，由浏览器对其完成一边解释一边执行。它能将其他的技术合理的调动起来，使用脚本调用XmlHttpRequest对象进行与服务器的异步通信；另一方面JavaScript可以通过其灵活的属性和方法弥补传统Web页面只能提供静态Html的不足，提高Web页面的交互性，为页面增添了更多动态活跃的元素。通过其自身的方法和属性对文档模型DOM和页面样式文件CSS进行操作，动态更新页面布局、样式和内容，使整个过程流畅的运行，搭建起不同技术之间沟通的桥梁。 （3） XHTML和CSS。XHTML和CSS在Ajax应用中主要实现的是页面呈现的职能。XHTML（eXtensible HyperText Markup Language），称作可扩展超文本标记语言，是当前以及未来的Web文档标准之一。实际上XHTML是一种为了适应XML而对HTML进行重新改造的标记语言。CSS（Cascading Style Sheets）全称为层叠样式表，是W3C组织推出的一项美化web页面的扩展样式标准。它的出现弥补了原本HTML在元素样式表现力上的不足。 4、Ajax在网站设计中的简单应用 本实例主要通过Ajax技术实现不刷新页面检测用户名是否被占用。其主要代码如下： public class Ajax ： IHttpHandler { public void ProcessRequest （HttpContext context） { context.Response.ContentType = “text/plain”； context.Response.Buffer = true； context.Response.ExpiresAbsolute = DateTime.Now.AddDays（-1）； context.Response.AddHeader（”pragma”， “no-cache”）； context.Response.AddHeader（”cache-control”， ““）； context.Response.CacheCo