ajax软件开发技术第1章

《ajax软件开发技术第1章》由会员分享，可在线阅读，更多相关《ajax软件开发技术第1章（65页珍藏版）》请在金锄头文库上搜索。

1、Ajax软件开发技术 课程简介 2015/3/16吉林大学珠海学院计算机系2 课程纲要 n授课方式 n授课教材：挑战JavaScript&Ajax应用 开发 n理论课时：32学时 n实验课时：16学时 n考核方式 n平时上课考勤+上机 30% 大作业 20% n期末考试笔试 50% Ajax软件开发技术 第1章 AJAX 概述 2015/3/16吉林大学珠海学院计算机系4 本章内容 nWeb简介 nAjax概述 n深入理解Ajax nAjax体验 n本章小结 2015/3/16吉林大学珠海学院计算机系5 目标 n了解Web相关基础知识 n掌握Ajax技术的概念 n掌握Ajax的相关技术 n理解

2、Ajax的工作原理及基本原则 n了解Ajax的优势以及特征 2015/3/16吉林大学珠海学院计算机系6 本章内容 n1.1 Web简介 n1.2 Ajax概述 n1.3 深入理解Ajax n1.4 Ajax体验 n1.5 本章小结 2015/3/16吉林大学珠海学院计算机系7 1.1.1 Web 基础知识 n1 Web 定义 nWeb：是以 HTML 语言和 HTTP 协议为基础、 提供面向 Internet 服务、支持一致用户界面 的全球信息网络，具有交互性、动态性和多平 台等特性。 nWeb 包括 Web 客户机和 Web 服务器，其访 问过程：用户输入网址（ HTTP 请求）传输 服务

3、器 接收、处理返回网页 2015/3/16吉林大学珠海学院计算机系8 1.1.1 Web 基础知识 n2 HTTP 协议 nHTTP 协议是 Web 客户机和服务器用来 交换信息的一种 Internet 应用协议 nHTTP 协议的两个显著特性： n无连接性 n无状态性 是指限制每次连接只处理一个请求。服务器处理 完客户的请求，并收到客户的应答后，即断开连 接。采用这种方式可以节省传输时间。 无状态是指协议对于事务处理没有记忆能力。缺 少状态意味着如果后续处理需要前面的信息，则 它必须重传，这样可能导致每次连接传送的数据 量增大。另一方面，在服务器不需要先前信息时 它的应答就较快。 2015/

4、3/16吉林大学珠海学院计算机系9 1.1.1 Web 基础知识 n3 HTML 文档 n超文本：也是普通文本，通过标签控制文本 的显示格式，嵌入链接、声音、图像、视频、 动画等多媒体信息 n超链接：是指从一个网页指向另一个目的端 的链接 nHTML 语言：超文本标记语言，用于描述网 页。 nHTML 文档：通常称为网页、页面，是符合 HTML 语言规则的超文本文件，其最常见扩展 名是“.htm”和“.html” 2015/3/16吉林大学珠海学院计算机系10 1.1.1 Web 基础知识 n4 Web发展史 n1990年11月，第一个Web服务器 nxoc01.cern.ch开始运行 n19

5、91年，CERN（European particle physics laboratory）正式发布Web技术标准 nW3C组织（World Wide Web Consortinum） 2015/3/16吉林大学珠海学院计算机系11 1.1.1 Web 基础知识 n4 Web发展史 nWeb2.0（基于XML与HTML混合规范的网页） 是相对Web1.0（基于HTML规范的网页） 的新 的一类互联网应用的统称。 随着Web2.0的出 现，互联网进入了一个更加开放、交互性更 强、由用户决定内容并参与共同建设的可读写 的网络阶段 nWeb2.0本身并没有特别明确的标准来进行描 述，一般将促成这个阶

6、段的各种技术和相关的 产品服务统称为Web2.0 2015/3/16吉林大学珠海学院计算机系12 1.1.2 Web 浏览器与 Web 服务器 n1 Web 浏览器 nWeb 浏览器：显示网页、允许用户与网页互 动的 Web 客户端程序。常用 IE、Firefox、 Opera、Safari、Maxthon 和 Mosaic 等 nIE： IE 6.0（2001年8月） IE 7.0（2006 年11月） IE 8.0（2009年3月） nFirefox：火狐，由 Mozilla 基金会 与开源 团体共同开发的 Web 浏览器。跨平台特色， 常用 Firefox 3.X （2008年6月） 2

7、015/3/16吉林大学珠海学院计算机系13 1.1.2 Web 浏览器与 Web 服务器 n2 Web 服务器程序 nWeb 服务器程序（ HTTP 服务器）：是 指在Web 服务器主机上运行的、提供 Web 信息服务的程序。 n最著名的 web 服务器是微软的 IIS 和 免费的 Apache。它们都支持 ASP、PHP 和 JSP 等主流动态网站技术，但相对来 说，Apache 支持的开发语言更多，而 IIS 则偏重于支持 ASP。 2015/3/16吉林大学珠海学院计算机系14 1.1.3 动态网页及相关技术 n1 客户端动态网页 nDHTML：是一种即使在网页下载到浏览器以后 仍然能

8、够随时变换的网页。 n3个主要特征 n动态样式：改变网页的外部显示特征 n动态内容：更换显示的文本或图像 n动态定位：移动文本、图像等页面元素 nDHTML技术：脚本语言（如 JavaScript、 VBScript）、DOM 和CSS 等 2015/3/16吉林大学珠海学院计算机系15 1.1.3 动态网页及相关技术 n2 服务器端动态网页 n基于 Web 服务器角度，动态网页是指采用动 态网站技术实时动态生成的网页 n常用的动态网站技术 nASP：微软，传统 ASP ASP.NET（aspx） nPHP： 具有开源、免费、简单、易扩展等 特点，扩展名是 php。版本：PHP 5.X nJS

9、P：具有简单易用、完全面向对象、跨平 台和安全可靠等特点。与 ASP 类似，JSP 在 HTML 中嵌入 Java 程序段，从而形成 JSP 动态网页文件（*.jsp）。版本： JSP 2.X 2015/3/16吉林大学珠海学院计算机系16 1.1.4 Web应用程序 n应用程序有两种结构：C/S、B/S。 n1 C/S结构 nC/S是客户端/服务器端程序，这类程序一般 独立运行。C/S 结构应用的服务器主要安装 数据库管理系统，也可以包含一些业务逻辑 实现。通过把软件系统的计算和数据合理的 分配在客户机和服务器两端，可以有效降低 网络通信量和服务器运算量。 2015/3/16吉林大学珠海学院

10、计算机系17 1.1.4 Web应用程序 n2 B/S结构 nB/S是浏览器端/服务器端应用程序，这类应用程序 一般借助IE等浏览器来运行。WEB应用程序一般是 B/S模式。用户只需要有浏览器，不需要再安装其 他软件，即可轻松访问应用程序。 nB/S结构的优势： n数据安全性高 n数据一致性好 n数据实时性好 n系统更新方便 n网络应用限制小 2015/3/16吉林大学珠海学院计算机系18 1.1.4 Web应用程序 n3 传统Web应用解决方案 n在传统的Web应用模型下，客户机 （浏览 器或者本地机器上运行的代码）向服务器发 出请求。然后服务器开始处理（接收数据， 执行业务逻辑，访问数据库

11、等），最后向客 户机返回HTML页面。由于该请求是同步的 ，当服务器处理请求时，用户能够做什么呢 ？只有等待！ 2015/3/16吉林大学珠海学院计算机系19 1.1.4 Web应用程序 n3 传统Web应用解决方案 n传统Web 应用程序让人感到笨拙或缓慢的原因 缺乏真正的交互性。将所有操作都集成在服务 器端进行，客户端所做的工作只是简单的网页显 示。- 胖服务器端和瘦客户端。 nAjax技术的出现，改变了传统Web开发的模式。 通过Ajax技术，可以将大量的服务器端工作移植 到客户端完成。 2015/3/16吉林大学珠海学院计算机系20 1.1.4 Web应用程序 n4 富Internet

12、应用 nRIA（Rich Internet Applications）应用程 序吸收了桌面应用程序的反应快、交互强 的优点，改进了Web应用程序的用户交互 ，可以提供一种更丰富、更具有交互性和 响应性的用户体验。 2015/3/16吉林大学珠海学院计算机系21 1.1.5 Web 标准化 n1 Web 标准 n Web 标准是指由 W3C 、ECMA 等标准化组织 制订的一系列 Web 技术规范总称，包括： n结构标准：内容结构， HTML、XML、XHTML n表现标准：表现格式， CSS （层叠样式表 ） n行为标准：动态行为， DOM（文档对象模 型）和 ECMAScript（JavaS

13、cript，JScript ） n规范文档 nhttp:/www.w3.org n验证 http:/validator.w3.org 2015/3/16吉林大学珠海学院计算机系22 1.1.5 Web 标准化 n2 Web 标准化：在制作网页时遵循 Web 规范 并采用相关理念 n方法： n采用 XHTML + CSS + JavaScript 技术， 以实现网页结构、表现和行为的分离 n正确使用 HTML 标签，即编写结构化的、 有语义的 HTML n使用 CSS 处理网页的外观 n依靠 JavaScript 去增强、而不是替代网 站的特征 2015/3/16吉林大学珠海学院计算机系23 本

14、章内容 nWeb简介 nAjax概述 n深入理解Ajax nAjax体验 n本章小结 2015/3/16吉林大学珠海学院计算机系24 1.2.1 Ajax概念 nJesse James Garrett 2005年的2月 Ajax: A New Approach to Web Applications XML A J A X synchronous avaScript nd ML 2015/3/16吉林大学珠海学院计算机系25 1.2.1 Ajax概念 nAjax是Web2.0阶段系列技术和相关产 品服务中非常重要的一种技术 nAjax (Asynchronous JavaScript and

15、XML)不是一个新的技术，事实上，它 是一些旧有的成熟的技术以一种全新的 更加强大的方式整合在一起。 2015/3/16吉林大学珠海学院计算机系26 1.2.1 Ajax概念 (1)HTML/XHTML：实现页面内容的表示 (2) CSS：格式化文本内容 (3) DOM：对页面内容进行动态更新 (4) XML和XSLT：实现数据的交换和格式的转换 (5) XMLHttpRequest对象：实现和服务器的异步通 讯 (6) Javascript：将以上技术融合在一起 2015/3/16吉林大学珠海学院计算机系27 1.2.1 Ajax概念 2015/3/16吉林大学珠海学院计算机系28 1.2.

16、2 Ajax解决方案的优势 n基于公开的标准 n增加了页面数据的更新，同时减少了页面刷新 和刷新等待的时间 n跨平台跨浏览器的兼容性 nAjax技术可以将传统的服务器工作转嫁到客户 端，从而减轻服务器和带宽的负担 n技术独立性 2015/3/16吉林大学珠海学院计算机系29 1.2.3 Ajax的缺点 n不尽人意的响应速度 n破坏浏览器上的后退按钮 n破坏书签和阻碍搜索引擎编制索引 n浏览器不堪重负 2015/3/16吉林大学珠海学院计算机系30 1.2.4 Ajax相关技术简介 1 数据交换和显示 描述页面的HTML/XHTML HTML-超文本标记语言 XHTML-可扩展超文本标记语言 n结合了XML中部分强大功能及HTML中 的大部分简单特性 n设计上显得更严密，可以很自然地实现 从HTML到XML的转换 2015/3/16吉林大学珠海学院计算机系31 1.2.4 Ajax相关技术简介 n1 数据交换和显示 nXML-可扩展标记语言 n用于简单数据的表示和交换 n用于面向消息的计算 n与用户界面相关，表示相关的上下文 n定义元素样