22Web页的特点 上网的人大约有80%的时间在浏览web页,最主要的原因是web页上有他需要的 信息,而且这些信息内容必须具有及时、新颖、美观、方便、简单、有价值和适应性强等特 点,否则就不能吸引浏览者 及时、新颖体现在信息内容要是最新的。而动态网页可以方便地做到内容更新 美观是人人可见的。Web页不仅有文字,它还包含图片、各种字体、可点击的按钮以 及动画等许多内容。 方便是因为Web页都是超文本。在web页上,任何一个字、短语、图片、按钮等都可 以被指定为一个超链接,当选择访问一个超链接所指的内容时,只要用鼠标在链接上单 击,它就会自动地显示在计算机上。超链接就像“超人”一样,可以任意地在信息世界里遨 游,所以,Web页面又称为超文本页面 简单指的是超文本描述语言HTML,它仅仅是用来规定页面布局的一组标记且数量 有限,简单易学,人人都可以亲手制作 适应性强是指Web页是独立于操作系统平台的,可以用任何一种浏览器来显示它, 也可以用任何一种文本编辑器来编辑它 23不同类型的Web页 Web页起初都是用HTML(超文本标记语言)设计的,所以在网上可以看到许多网 页文件的后缀名为HTML或htm。但现在有很多Web页文件的后缀名为jsp、asp、 aspx、php、phpx等,这些Web页是有区别的,它们表示网页是由不同的web开发技术设 计的。 124三层BS结构和动态网页 内容能够因人因时变化、能够在客户端与服务器端进行交互的网页是动态网页。在 动态网页的设计中,常用数据库向Web服务器提供数据,图13为引入web数据库后的 三层BS结构示意图 超 URI 行脚本程序上SQL查询一执行SOL查询 链 返回查询结果 接卜HTML文件 产生HTML文件 一查询结果 客户机浏览器 Wcb服务器 数据库服务器 图13引入Web数据库后的三层BS结构 当客户机通过URL向web服务器请求下载信息时,在web服务器上要运行嵌入在 网页中的脚本程序,脚本程序通过SQL査询调用数据库服务器中存储的数据,数据库服
1 .2 .2 Web 页的特点 上网的人大约有 80%的时间在浏览 Web 页, 最主要的原因是 Web 页上有他需要的 信息,而且这些信息内容必须具有及时、新颖、美观、方便、简单、有价值和适应性强等特 点,否则就不能吸引浏览者。 及时、新颖体现在信息内容要是最新的。而动态网页可以方便地做到内容更新。 美观是人人可见的。Web 页不仅有文字,它还包含图片、各种字体、可点击的按钮以 及动画等许多内容。 方便是因为 Web 页都是超文本。在 Web 页上, 任何一个字、短语、图片、按钮等都可 以被指定为一个超链接, 当选择访问一个超链接所指的内容时, 只要用鼠标在链接上单 击,它就会自动地显示在计算机上。超链接就像“超人”一样, 可以任意地在信息世界里遨 游,所以, Web 页面又称为超文本页面。 简单指的是超文本描述语言 H TML,它仅仅是用来规定页面布局的一组标记且数量 有限,简单易学, 人人都可以亲手制作。 适应性强是指 Web 页是独立于操作系统平台的, 可以用任何一种浏览器来显示它, 也可以用任何一种文本编辑器来编辑它。 1 .2 .3 不同类型的 Web 页 Web 页起初都是用 H TML( 超文本标记语言 ) 设计的, 所以在网上可以看到许多网 页文件的后缀名为 H TML 或 htm。但现 在有很多 Web 页文件的后 缀名为 jsp、asp、 aspx、php、phpx 等,这些 Web 页是有区别的,它们表示网页是由不同的 Web 开发技术设 计的。 1 .2 .4 三层 B/ S 结构和动态网页 内容能够因人因时变化、能够在客户端与服务器端进行交互的网页是动态网页。在 动态网页的设计中,常用数据库向 Web 服务器提供数据,图 1 .3 为引入 Web 数据库后的 三层 B/ S 结构示意图。 图 1 .3 引入 Web 数据库后的三层 B/ S 结构 当客户机通过 U RL 向 Web 服务器请求下载信息时,在 Web 服务器上要运行嵌入在 网页中的脚本程序,脚本程序通过 SQL 查询调用数据库服务器中存储的数据, 数据库服 · 6 ·
务器执行査询操作,将结果返回到Web服务器,产生特定格式的HTML文件。这样当客 户端浏览器通过URL请求信息到显示信息完毕,客户端接收到的HTML文件中的内容 实际上是由数据库提供的。这种方式使处理更灵活,自由度更大。 出于效率考虑,Web服务器和数据库服务器常在一个局域网中,甚至在同一台机器 上。由动态网页组成的网站称为动态网站,它有如下优点 自动更新。即无需手动更新HTML文档,便会自动生成新的页面,可以大大节省 工作量,如新闻网站。 交互性。即网页会根据用户的要求及选择而动态改变和响应,将浏览器作为客户 端界面。例如,电子商务中的网上超市、网上书店、留言簿等,这将是今后Web发 展的趋势。 因时因人而变。即当不同的时间、不同的人访问同一网址时会产生不同的页面, 例如,网上教务系统 13Web开发技术 在Web网络短暂的发展史中,它已经从一个大部分显示静态信息的网络媒体演化到 能对股票进行交易和进行网上购书等操作的一个基础设施。在Web网络上可以使用各 种各样的应用程序,这些应用程序进一步扩大了Web网络的应用。它不仅表现在网络 上,还表现在企业及其他各个领域,传统的基于客户机服务器的应用程序被基于浏览器 客户端的应用程序所替代 基于浏览器客户端的应用程序较传统的基于客户机服务器的应用程序有很多优点 这些优点包括几乎没有限制的客户端访问和极为简化的应用程序部署及管理(要更新 个应用程序,管理人员只需要更改一个基于服务器的程序,而不是成千上万的安装在客户 端的应用程序)。这些变化使得软件产业迅速地向建造基于浏览器客户端的多层次应用 程序迈进。 快速增长的需求,使得基于Web的应用程序要求Web在开发技术上不断改进。静 态HTML对于显示相对静态的内容是不错的选择,但新的挑战在于创建交互的基于 Web的应用程序,在这些程序中,页面的内容是基于用户的请求或者系统的状态,而不是 预先定义的文字。为满足这种需要,一些动态的Web开发技术应运而生 131静态语言—HTML 1.HTML的发展过程 HTML( Hyper Text Markup Language,超文本置标语言)是一种用来制作超文本文 档的简单标记语言。HTML诞生于20世纪90年代,最初只是网上代用语言,其设计思 想非常简单。当时 Tim berners-Lee只是希望在网上显示文字,他设计了一个初级浏览 器和一个编辑系统,并在网上合二为一,创建了一种快速小型超文本语言即HTML来为 他的系统服务。 Berners-Le设计的HTML是以文本格式为基础的,所以可以用任何编
务器执行查询操作,将结果返回到 Web 服务器, 产生特定格式的 H TML 文件。这样当客 户端浏览器通过 U RL 请求信息到显示信息完毕, 客户端接收到的 H T ML 文件中的内容 实际上是由数据库提供的。这种方式使处理更灵活,自由度更大。 出于效率考虑, Web 服务器和数据库服务器常在一个局域网中, 甚至在同一台机器 上。由动态网页组成的网站称为动态网站,它有如下优点。 自动更新。即无需手动更新 H TML 文档, 便会自动生成新的页面,可以大大节省 工作量,如新闻网站。 交互性。即网页会根据用户的要求及选择而动态改变和响应, 将浏览器作为客户 端界面。例如,电子商务中的网上超市、网上书店、留言簿等, 这将是今后 Web 发 展的趋势。 因时因人而变。即当不同的时间、不同的人访问同一网址时会产生不同的页面, 例如,网上教务系统。 1 .3 Web 开发技术 在 Web 网络短暂的发展史中, 它已经从一个大部分显示静态信息的网络媒体演化到 能对股票进行交易和进行网上购书等操作的一个基础设施。在 Web 网络上可以使用各 种各样的应用程序,这些应用程序进一步扩大了 Web 网络的应用。它不仅表现在网络 上,还表现在企业及其他各个领域, 传统的基于客户机/ 服务器的应用程序被基于浏览器 客户端的应用程序所替代。 基于浏览器客户端的应用程序较传统的基于客户机/ 服务器的应用程序有很多优点, 这些优点包括几乎没有限制的客户端访问和极为简化的应用程序部署及管理 (要更新一 个应用程序,管理人员只需要更改一个基于服务器的程序, 而不是成千上万的安装在客户 端的应用程序)。这些变化使得软件产业迅速地向建造基于浏览器客户端的多层次应用 程序迈进。 快速增长的需求,使得基于 Web 的应用程序要求 Web 在开发技术上不断改进。静 态 H TML 对于显示相对静态的内容是不错的选择, 但新的挑战在于创建交互 的基于 Web 的应用程序,在这些程序中, 页面的内容是基于用户的请求或者系统的状态, 而不是 预先定义的文字。为满足这种需要,一些动态的 Web 开发技术应运而生。 1 .3 .1 静态语言———HTML 1 . HTML 的发展过程 H TML( Hyper Text Markup Language ,超文本置标语言 )是一种用来制作超文本文 档的简单标记语言。H TML 诞生于 20 世纪 90 年代, 最初只是网上代用语言,其设计思 想非常简单。当时 Tim Berne rs-Lee 只是希望在网上显示文字, 他设计了一个初级浏览 器和一个编辑系统,并在网上合二为一, 创建了一种快速小型超文本语言即 H TML 来为 他的系统服务。Be rners-Lee 设计的 H TML 是以文本格式为基础的, 所以可以用任何编 · 7 ·
辑器和文字处理器创建,而且它仅有不多的几个标记,所以很容易掌握编写HTML文件 的方法。网络从此开始了新篇章,并因此而得到迅猛发展,人们可以在网上很容易地发布 信息、浏览信息。 人们能在网上看到文本后,又想在网上看到图像、动画等,而早期的浏览器仅以文本 为基础。如何解决这个问题呢?1993年,一个名叫 Marc andreessen的大学生在他的 Mosaic浏览器上加入了图像<img>标记,在web网络上可以看到图像了。随后 Mosaic浏览器随<img>推向市场, Tim berners-Lee加入了初期的国际互联网研究组 织,而Marc在加利福尼亚创建了一个名为 Netscape的浏览器公司。但人们认为仅有图 像和图标还远远不够,希望可以将任何形式的媒介加到网页上去。因此,HTML不停地 发展,不断产生新型、功能强大且生动有趣的标记形式和可以识别它们的浏览器。所以 出现了< background>(背景)、< frame>(框架)、<font>(字体)和< blink>(闪烁效 果)等标记。微软公司致力于网上游戏领域,他们设计了< marquee>(滚动的字)和 < bgsound>(背景声效)等标记。越来越多的标记会不会给浏览器造成困惑呢?HTML 的一个优越特性是如果一个web浏览器不能识别一个标记属性时,这个属性将被忽略, 而且不会有任何副作用。所以,在HTML中可以放心地使用各种标记 HTML的发展过程很有启发意义,而且由于HTML的出现,使互联网络得到迅猛地 发展,人们越来越离不开网络了 2.HML语言的作用 用HTML编写的超文本文档称为HTML文档,它能独立于各种操作系统平台(如 Unix, Windows等)。自1990年以来HTML就一直被用于互联网上的信息表示语言,用 于描述页面的格式设计和它与WWW上其他页面的连接信息 HTML语言使用描述性的标记符(称为标记码)来指明文档的不同内容。标记码是 区分文本各个组成部分的分界符,用来把HTML文档划分成不同的逻辑部分(或结构), 如段落、标题和表格等。标记码描述了文档的结构,它向浏览器提供该文档的格式化信 息,以传送文档的外观特征。HTML文档包含两种信息,一是页面本身的文本;二是表示 页面元素、结构、格式和其他超文本链接的HTML标记。 HTML文档是一个放置了标记的ASCI文本文件,通常它带有htm或htm的文 件扩展名。它在文本文件的基础上,由一系列指明Web页的样式的标记符号构成 HTML标记由一对尖括号和若干字母及符号构成。 [例1.1]一个html文件(1-1.html文件) <html> head> title> Web页面的标题 title> < head body>
辑器和文字处理器创建,而且它仅有不多的几个标记, 所以很容易掌握编写 H TML 文件 的方法。网络从此开始了新篇章,并因此而得到迅猛发展, 人们可以在网上很容易地发布 信息、浏览信息。 人们能在网上看到文本后,又想在网上看到图像、动画等, 而早期的浏览器仅以文本 为基础。如何解决这个问题呢 ? 1993 年, 一个名叫 Marc Andreessen 的大学生在他的 Mosaic 浏览器 上加入 了图像 < img > 标 记, 在 Web 网 络上 可以 看到 图像 了。随后, Mosaic 浏览器随 < img > 推向市场, Tim Berne rs-Lee 加入了初期的国际互联网研究组 织,而 Mar c 在加利福尼亚创建了一个名为 Netscape 的浏览器公司。但人们认为仅有图 像和图标还远远不够,希望可以将任何形式的媒介加到网页上去。因此, H TML 不停地 发展,不断产生新型、功能强大且生动有趣的标记形式和可以识别它们的浏览器。所以, 出现了 < backgrou nd > ( 背景 )、< frame > ( 框架 )、< font > ( 字体 ) 和 < blink > (闪烁效 果)等标记。微 软公司致 力于网上 游戏领域, 他们设计 了 < marquee > ( 滚动的 字 ) 和 < bgsound > (背景声效)等标记。越来越多的标记会不会给浏览器造成困惑呢 ? H TML 的一个优越特性是如果一个 Web 浏览器不能识别一个标记属性时, 这个属性将被忽略, 而且不会有任何副作用。所以,在 H TML 中可以放心地使用各种标记。 H TML 的发展过程很有启发意义,而且由于 H TML 的出现, 使互联网络得到迅猛地 发展,人们越来越离不开网络了。 2 . HTML 语言的作用 用 H TML 编写的超文本文档称为 H T ML 文档, 它能独立于各种操作系统平台 ( 如 Unix, Windows 等)。自 1990 年以来 H TML 就一直被用于互联网上的信息表示语言, 用 于描述页面的格式设计和它与 WWW 上其他页面的连接信息。 H TML 语言使用描述性的标记符 (称为标记码 )来指明文档的不同内容。标记码是 区分文本各个组成部分的分界符,用来把 H TML 文档划分成不同的逻辑部分( 或结构 ) , 如段落、标题和表格等。标记码描述了文档的结构, 它向浏览器提供该文档的格式化信 息,以传送文档的外观特征。H T ML 文档包含两种信息, 一是页面本身的文本; 二是表示 页面元素、结构、格式和其他超文本链接的 H TML 标记。 H TML 文档是一个放置了标记的 ASCII 文本文件, 通常它带有 .html 或 .htm 的文 件扩展名。它在文本 文件 的基础 上, 由 一系列 指明 Web 页 的样 式的标 记符号 构成。 H TML 标记由一对尖括号和若干字母及符号构成。 [例 1 .1 ] 一个 html 文件 (1-1 . html 文件) 。 < html > < head > < title > Web 页面的标题 </ title > </ head > < body > · 8 ·
HTML语言的范例 <img src="girl gif"height= 120 width=90> p </ body < html> 该文件可显示一句话“HTML语言的范例”和一个图片文件 girl gif。在浏览器里浏 览该页面时,浏览器将把每个标记解释成它指明的含义,在默认位置以指定的样式将内容 显示在屏幕上。在屏幕上看不到HTML标记符号,只能看到文字和图片,如图14 所示 2eb页画的标题- licrosoftInternet..-区 文件①)阙锅①)查看四收露⑧)工具①)帮助” 冈日索 地址囹到上刚助手团因区回 暂停拦截 @搜索③新闻乏即 M语言的范例 图14HTML标记描述的页面 利用HTML语言的标记,可以在页面上放置文本内容,可以设置文本内容的字体和 颜色,可以加入指向 Internet上任意一个页面的超链接,可以插入各种图像和表格。正是 有了这些HTML标记,Web页才变得漂亮美观,多姿多彩。HTML语言使网络从一个 静态的文本世界变成一个丰富的多媒体世界。在网上,HTML是最早的公用语言,网上 的信息资源大都使用HTML语言来描述 3.HTML的不足 随着wεb网络应用的发展,HTML语言的不足开始显现出来。主要表现如下 (1)静态性 由于HTML文档在浏览时不会因时因地而发生变化,也不允许在浏览器加载后更 改页面内容,所以称HTML文档为静态网页 (2)格式与布局的局限 在HTML文档中不能随意扩展文本格式。不能设计像报纸、杂志那样漂亮的布局 (3)不能设计应用程序的功能
H T ML 语言的范例 < p > < img src = " girl .gif" height = 120 width = 90 > </ p > </ body > </ html > 该文件可显示一句话“ HT ML 语言的范例”和一个图片文件 girl .gif。在浏览器里浏 览该页面时,浏览器将把每个标记解释成它指明的含义, 在默认位置以指定的样式将内容 显示在屏 幕上。在屏幕上 看不到 H TML 标 记符号, 只能 看到 文字和 图片, 如 图 1 .4 所示。 图 1 .4 H T ML 标记描述的页面 利用 H TML 语言的标记, 可以在页面上放置文本内容, 可以设置文本内容的字体和 颜色,可以加入指向 Internet 上任意一个页面的超链接, 可以插入各种图像和表格。正是 有了这些 H TML 标记, Web 页才变得漂亮美观, 多姿多彩。H T ML 语言使网络从一个 静态的文本世界变成一个丰富的多媒体世界。在网上, H T ML 是最早的公用语言, 网上 的信息资源大都使用 H TML 语言来描述。 3 . HTML 的不足 随着 Web 网络应用的发展, H TML 语言的不足开始显现出来。主要表现如下。 (1 ) 静态性 由于 H TML 文档在浏览时不会因时因地而发生变化, 也不允许在浏览器加载后更 改页面内容,所以称 H TML 文档为静态网页。 (2 ) 格式与布局的局限 在 H TML 文档中不能随意扩展文本格式。不能设计像报纸、杂志那样漂亮的布局。 (3 ) 不能设计应用程序的功能 · 9 ·
在HTML文档中不能实现高级程序设计语言的计算功能,所以不能满足人们对网 络功能越来越多的需求 HTML的不足给其他Web开发技术留下了空间,一些动态的web开发技术开始 出现 32脚本语言— JavaScript和 SCript 为了弥补HTML语言只能设计静态页面的不足,出现了 JavaScript和Ⅴ SCript描 述语言,或称为脚本语言。脚本语言是介于HTML和诸如Java、Ⅴ isual basic、C++等编 程语言之间的一种特殊的语言,尽管它更接近后者,但它却不具有编程语言复杂、严谨的 语法和规则。它可以被嵌入HTML文件之中,与HTML语言一起构成一个HTML 文件。 利用脚本语言可以让编写的网页智能化,使HTML具有动态功能。例如,通过脚本 语言可以在网页上输入计算信息,不用任何的网络来回传送,即不用传给服务器处理,利 用浏览器使用脚本语言,可直接将计算的结果显示在页面上 脚本语言通过脚本嵌入到HTML文档,脚本由一系列的脚本语言命令组成。如同 般的程序,脚本可以将一个值赋给一个变量,可以将一系列命令定义成一个过程来完成 个功能计算 但脚本语言功能有限,只是对HTML的一种补充,它们不能完全满足网络应用 需要。 133客户端的动态技术— DHTML DHTML是 Dy namIc HTML的缩写,称为动态的HTML。它通过HTML语言,利 用CSS( Cascading Style Sheets,样式表)和脚本语言使一向静止不变的页面得以动起来。 DHTML是一种完全“客户端”技术,直接通过Web页实现页面与用户之间的交互 DHTML与HTML的最大区别就是能改变网页的内容,增强web页面的功能,可 在web页面直接建立动画、游戏和应用功能等,提供了浏览站点的全新方式。与Java、 Flash等技术不同的是,用 DHTML编制的页面功能不需要插件的支持就能完整地实现 DHTML实现的基础是HTML、CSS、 JavaScript和 VBScript。CSS样式表是 HTML的扩展,可以重新定义Web页面的显示风格,给设计者提供了更大的灵活性。 JavaScript和Ⅴ SCript脚本可以给页面增加应用功能。 DHTML还包括一些新技术,如 数据绑定。可以将数据从数据源传递到Wεb页中,实现从服务器上动态地返回数据 DHTML可以说是web技术发展到一定阶段,适应人们迫切需求的一种必然技术 虽然,随着ASP、JSP的出现, DHTML的许多功能逐渐被取代。但是,ASP、JSP是基于 服务器端执行的,而 DHTML是在客户端执行的,因此将二者结合会得到更加完美的 效果 134动态网页技术 SP ASP的英文全称是 Active Server Pages,翻译为中文就是动态服务器网页。它与
在 H TML 文档中不能实现高级程序设计语言的计算功能, 所以不能满足人们对网 络功能越来越多的需求。 H TML 的不足给其他 Web 开发技术留下了空间, 一些动态的 Web 开发技术开始 出现。 1 .3 .2 脚本语言———JavaScript 和 VBScript 为了弥补 H TML 语言只能设计静态页面的不足, 出现了 JavaScript 和 VBScript 描 述语言,或称为脚本语言。脚本语言是介于 HT ML 和诸如 Java、Visual Basic、C + + 等编 程语言之间的一种特殊的语言,尽管它更接近后者, 但它却不具有编程语言复杂、严谨的 语法和规则。它可以被嵌 入 H TML 文件之 中, 与 H TML 语 言一起构 成一个 H TML 文件。 利用脚本语言可以让编写的网页智能化, 使 H TML 具有动态功能。例如,通过脚本 语言可以在网页上输入计算信息,不用任何的网络来回传送, 即不用传给服务器处理, 利 用浏览器使用脚本语言,可直接将计算的结果显示在页面上。 脚本语言通过脚本嵌入到 H TML 文档, 脚本由一系列的脚本语言命令组成。如同 一般的程序,脚本可以将一个值赋给一个变量, 可以将一系列命令定义成一个过程来完成 一个功能计算。 但脚本语言功能有 限, 只是 对 H T ML 的一 种补充, 它 们不 能完全 满足 网络应 用 需要。 1 .3 .3 客户端的动态技术———DHTML DH T ML 是 Dynamic H T ML 的缩写, 称为动态的 H TML。它通过 H TML 语言, 利 用 CSS( Cascading Style Sheets, 样式表)和脚本语言使一向静止不变的页面得以动起来。 DH T ML 是一种完全“客户端”技术, 直接通过 Web 页实现页面与用户之间的交互。 DH T ML 与 H TML 的最大区别就是能改变网页的内容, 增强 Web 页面的功能, 可 在 Web 页面直接建立动画、游戏和应用功能等, 提供了浏览站点的全新方式。与 Java、 Flas h 等技术不同的是,用 DH TML 编制的页面功能不需要插件的支持就能完整地实现。 DH T ML 实 现 的 基 础 是 H TML、CSS、JavaScript 和 VBScript。 CSS 样 式 表 是 H TML 的扩展,可以重新定义 Web 页面的显示风格, 给设计者提供了更大的灵活性。 JavaScript 和 VBScript 脚本可以给页面增加应用功能。DH TML 还包括一些新技术, 如 数据绑定。可以将数据从数据源传递到 Web 页中, 实现从服务器上动态地返回数据。 DH T ML 可以说是 Web 技术发展到一定阶段, 适应人们迫切需求的一种必然技术。 虽然,随着 ASP、JSP 的出现, DH TML 的许多功能逐渐被取代。但是, ASP、JSP 是基于 服务器端执行的, 而 DH TML 是在客户端执行的, 因此将二者结合会得到更加完美的 效果。 1 .3 .4 动态网页技术———ASP ASP 的英文全称是 Active Server Pages, 翻译为中文就是动态服务器网页。它与 · 10 ·