《Ajax应用详解》PPT课件.ppt

《《Ajax应用详解》PPT课件.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第十六章Ajax应用详解在本章的内容中，将要介绍Ajax技术，使用这种技术，可以构建出类似传统桌面应用程序的交互界面，可以丰富客户与服务器的交互方式。通过本章内容的学习，读者可以了解Ajax的基本知识，并且在本章中对Ajax处理客户请求的各个环节都进行了详细的分析，在具体的示例中展示了Ajax在各种情景下的具体应用，通过这些示例程序读者可以体会到Ajax的基本用法。16.1Ajax技术简介从本质上讲，Ajax并不是一种全新的技术，Ajax只是综合利用已经存在的各种技术，从而诞生了一种全新的应用，在本节内容中，将简单介绍这种技术的诞生过程和其他相关的基本知识。16.1.1Web开

2、发技术演变过程Web应用程序发展至今大体经历了三个阶段，第一个阶段使用的是简单的静态页面，第二个阶段使用的ASP、JSP、PHP等动态脚本语言，第三个阶段是Web2.0阶段，而Ajax就是Web2.0中的核心技术。（具体内容请参照书。）16.1.2什么是Ajax对于Ajax并没有确切的定义，而且随着Ajax被广泛应用，现在Ajax所包含的范围也更加广泛，所有的实现浏览器与服务器异步交互的技术都可以归入Ajax的范围，即无需刷新当前页面就可以实现与服务器的交互的技术，这种技术就是Ajax，而且Ajax也不像Java、JSP等是一种单独的技术，Ajax是一系列技术的集合，例如在在实

3、现与服务器的异步通信的时候，需要用到XML、JavaScript、XMLHttpRequest等，使用这几种技术可以实现与服务器的异步通信，所以，Ajax就是这几种语言的综合体。16.1.3Ajax的相关技术在上面的内容中，介绍了Ajax是一系列技术的集合体，通过这些技术的综合运用从而实现Ajax的目标，实现客户端与服务器端的异步通信。（具体内容请参照书。）16.2Ajax工作原理简单示例在本节的内容中，将通过一个具体的例子来展示Ajax的工作原理，通过与传统请求响应方式的对比，展现Ajax中处理请求响应的不同方式。在这个示例程序中，所要完成的任务非常简单，仅仅需要输入一个姓名

4、，然后提交这个表单，在服务器端处理这个请求，然后在页面显示处理的结果，在下面的示例程序中，将展示通过传统方式和Ajax方式处理这个请求响应的具体过程。16.2.1传统的请求响应方式在传统的请求响应方式中，是通过表单向服务器提交用户信息，服务器端处理接收到的信息，并把处理结果返回给用户，在这个过程中需要刷新整个页面才能得到服务器返回的结果。（具体内容请参照书。）16.2.2使用Ajax的请求响应方式在上面的示例程序中，展示了传统的请求响应处理方式，在本节中，将展示Ajax中处理请求响应的方式。在Ajax处理请求响应的方式中，不会整个页面进行刷新，对于用户的输入信息，并不依靠表单来

5、提交，而是通过XMLHttpRequest对象传递给服务器。（具体内容请参照书。）16.3XMLHttpRequest对象XMLHttpRequest对象在Ajax中占据着十分重要的地位，Ajax中的客户端就是通过XMLHttpRequest对象实现与服务器的通信，在本节内容中将详细介绍这个对象的基本知识。16.3.1XMLHttpRequest对象简介XMLHttpRequest对象也不是一个新的技术，这个对象最早出现在微软的IE浏览器中，是以ActiveX组件的形式出现的，在当时并没有引起开发人员太大的注意，但是在Google推出GoogleMap和GoogleSugges

6、t产品以后，Ajax技术以飞快的速度发展起来，而XMLHttpRequest对象又是Ajax的重要组成部分，所以XMLHttpRequest对象也开始重新受到重视。16.3.2创建XMLHttpRequest对象在使用XMLHttpRequest对象发送请求、接收响应之前，需要创建这个对象，其中，在IE浏览器中，XMLHttpRequest对象是以ActiveX组件的形式提供的，其他浏览器中使用JavaScript本地方法来创建，所以在创建XMLHttpRequest对象的时候，需要对这个差别做对应的判断和处理，下面的代码就是创建XMLHttpRequest对象的通用代码。16

7、.3.3XMLHttpRequest常用方法和属性在XMLHttpRequest对象创建以后，就可以在对这个对象进行各种不同的操作，从而完成和服务器的通信，接下来将介绍XMLHttpRequest对象常用的方法和属性。open（stringmethod,stringurl,booleanasynch,stringname,stringpassword）和send（content）是XMLHttpRequest对象中最常用的方法。16.4客户端向服务器发送请求在Ajax中，向服务器端发送请求使