《动态网页基础》word版
第9章动态网站设计基础
Dreamweaver CS5对动态网页设计提供了非常出色的支持,无论是网页的创建还是数据库程序的编写,均能通过可视化的方式完成,动态网页开发人员甚至不用编写任何程序代码,就可以使用Dreamweaver CS5快速创建具有各种功能的应用程序。
9.1 动态网页概述
9.1.1 动态网页的概念和特点
所谓动态网页,就是该网页文件不仅含有HTML标记,而且含有程序代码,这种网页的扩展名一般会根据不同的程序设计语言来确定,如ASP文件的扩展名为.asp。动态网页能够根据不同的时间、不同的来访者显示不同的内容,也可以根据浏览者的即时操作和请求,使其内容发生相应变化。如常见的新闻发布系统、留言系统、购物系统就是用动态网页来实现的。
动态网页具有以下特点:
(1)动态网页一般以数据库技术为基础,可以大大降低网站维护的工作量;
(2)采用动态网页技术的网站可以实现更多的功能,如用户注册、用户登录、在线调查、用户管理、订单管理等等;
(3)动态网页实际上并不是独立存在于服务器上的网页文件,只有当用户请求时,服务器才返回一个完整的网页;
(4)动态网页对搜索引擎检索存在着一定的问题。搜索引擎一般不可能从一个网站的数据库中访问全部网页,因此采用动态网页的网站在进行搜索引擎推广时需要做一定的技术处理才能适应搜索引擎的要求。
动态网页,并不是动态视觉特效。在一些网页上经常看到的滚动字幕、flash动画特效等,只是网页具体内容的各种表现形式。在很多时候,网页设计师都会采用静动结合的模式。在同一个站点内,根据功能模块进行划分,发挥两者各自的优势,取长补短。
9.1.2 ASP语言简介
ASP(Active Server Pages)是一个Web服务器端的脚本编写环境。借助它可以创建具有交互性的Web服务应用程序,例如用户管理、站内搜索等。
ASP使用的ActiveX技术基于开放设计环境,把对象进行封装,通过程序来调用。ASP本身封装了一些基本组件,高级程序员也自己开发了更多的实用组件,这使得动态网页有了无限的扩展潜力。ASP具有如下几个特点:
1. 无需进行编译,直接解释执行。
2. 无需用户端的浏览器支持,运行在服务器端。
3. 面向对象,组件引用很方便,也可任意定制服务器组件进行扩充。
4. 兼容性好,能使用任何ActiveX scripting 语言。
使用ASP的一个最大好处在于可以借助ADO(Active Data Object)这种新型的数据访问模型极为方便地访问数据库,从而也成就了基于交互性的网站系统开发。网页浏览者可以通过浏览器来输入、更新和删除站点数据库服务器中的数据。通过使用ASP内置的File Access 组件,可以读写站点服务器上的文件,来实现访客计数器、在线提醒等功能。甚至可以实现多个主页间共享信息
,来开发复杂的商务站点应用程序。
ASP 的工作原理很简单。当浏览器打开ASP 网页时,Web 服务器就会根据请求生成相应的HTML 代码,再返还给客户端浏览器。如此,网页浏览者就看到了动态生成的网页,如图9-1所示。
图9-1 ASP 的工作原理 借助于ASP ,服务端可接收网页浏览者提交的信息并做出及时的反应,网页设计师不必再去花费过多的精力去对网页文件进行更新。当用户填写好表单数据并提交HTTP 请求时,可以要求站点服务器去执行一个特意为表单所设定的应用程序,该程序会分析表单的输入数据,根据不同的数据内容,将相应的执行结果以HTML 格式传送给浏览器。
在处理数据库数据时,Web 服务器接收浏览器的请求,使用ODBC 把对数据库的命令请求通过网络传送到数据库服务器,然后再从数据库服务器接收数据,并把产生的反馈数据反馈给浏览器,如图9-2所示。
图9-2 处理数据库数据的工作原理
9.2 表单及其应用
表单在生活中的应用随处可见,我们在商店填写购物单、在邮局填写包裹单、在银行填写存款单等等。表单在互联网上的应用更为普遍,注册邮箱,登陆论坛、博客,通过Web 页收发邮件都需要填写表单。互联网中表单的作用可以概括为:为了实现浏览网页的用户同Internet 服务器之间的交互,通过表单将用户的信息发送到Internet 服务器上,以供处理。
9.2.1 表单简介
表单是Internet 上用户同服务器进行信息交互的主要工具。利用表单,Internet 服务器可以从用户处搜集信息,例如收集用户资料、问卷调查等;利用表单,用户可以向服务器提交申请,挖掘有用信息,例如Web 页邮箱登陆、Web 页搜索等,图9-3和图9-4分别了Internet
中表单的一些具体应用。
图9-3 问卷调查表单
图9-4 邮箱登陆表单
实现用户与服务器的交互,一方面客户端需要搜集用户信息的表单对象;另一方面需要有处理这些信息的服务器端应用程序,服务器应用程序通常是指服务器端的脚本程序。
表单中包含多种表单对象,也可以称作控件。例如文本框用于输入文字,复选框用于在多个选项中选择多项,单选按钮用于在多个选项中选择其一,列表框用于显示选项列表,按钮用于发送命令等等。在Dreamweaver CS5中,表单对象位于“插入”工具栏的“表单”类别中,如图9-5所示。
图9-5 表单对象
9.2.2 创建HTML表单
创建HTML表单的主要步骤如下。
1.打开一个页面,将插入点放在希望表单出现的位置。
2.选择“插入”>“表单”,或选择“插入”面板中的“表单”类别,然后单击“表单”图标。在“设计”视图中,表单以红色的虚轮廓线显示。如果看不到这个轮廓线,可选择“查看”>“可视化助理”>“不可见元素”。
3.在属性检查器(“窗口”>“属性”)中设置HTML表单的属性,如图9-6所示。
图9-6 表单的属性
1)在“文档”窗口中,单击表单轮廓以将其选定。
2)在“表单名称”框中,键入标识该表单的唯一名称。此后,就可以使用脚本语言(如JavaScript或VBScript)引用或控制该表单了。
3)在“动作”框中,键入路径或者单击文件夹图标导航到将要处理表单数据的页面或脚本。
4)在“方法”弹出菜单中,指定将表单数据传输到服务器的方法。设置以下任一选项:默认值:使用浏览器的默认设置将表单数据发送到服务器。通常,默认值为GET方法。
GET:将值附加到请求该页面的URL中。建议不要使用GET方法发送长表单,因为URL的长度限制在8192个字符以内。如果发送的数据量太大,数据将被截断,从而会导致意外的或失败的处理结果。
POST:在HTTP请求中嵌入表单数据。如果要收集机密用户名和密码、信用卡号或其它机密信息,POST方法可能比GET方法更安全。但是,由POST方法发送的信息是未经加密的,容易被黑客获取。若要确保安全性,可通过安全的连接与安全的服务器相连。
5)在“MIME 类型”弹出菜单中,指定对提交给服务器进行处理的数据使用 MIME 编码类型,(可选)。
默认设置application/x-www-form-urlencode,的通常与POST方法一起使用。如果要创建文件上传域,需指定multipart/form-data MIME类型。
6)在“目标”弹出菜单中,指定一个窗口来显示被调用程序返回的数据,(可选)。
_blank 在未命名的新窗口中打开目标文档。
_parent 在显示当前文档的窗口的父窗口中打开目标文档。
_self 在提交表单时所在的同一窗口中打开目标文档。
_top 在当前窗口的窗体内打开目标文档。此值可用于确保目标文档占用整个窗口,即使原始文档显示在框架中时也是如此。
4.在页面中插入表单对象:
1)将插入点置于表单中显示表单对象的位置。
2)在“插入”>“表单”菜单中或者在“插入”面板的“表单”类别中选择表单对象。
3)填写“输入标签辅助功能属性”对话框。该操作可以使表单对象具有辅助功能,并可以在以后更改辅助功能属性。
4)设置对象的属性。
5)在属性检查器中为该对象输入名称。每个文本域、隐藏域、复选框和列表、菜单对象必须具有可在表单中标识其自身的唯一名称。表单对象名称不能包含空格或特殊字符,可以使用字母数字字符和下划线“_”的任意组合。
6)若要为页面中的文本域、复选框或单选按钮对象添加标签,可在相应对象旁边单击,然后键入标签文字。为文本域指定的标签是用于存储该域值(输入的数据)的变量名,这是发送给服务器进行处理的值。
5.调整表单的布局。
可以使用换行符、段落标记、预格式化的文本或表格来设置表单的格式。不能将一个表单插入另一个表单中(即标签不能交迭),但是可以在一个页面中包含多个表单。设计表单时,
记住要用描述性文本来标记表单域,以使用户知道他们要回答哪些内容。例如,“键入您的名字”表示请求输入名字信息。
表单的基本语法及格式为:
表单的HTML标记为