基于ASP与Dreamweaver数据库网站的开发

2010-07-10 06:51
制造业自动化 2010年6期
关键词:网页页面动态

王 娟

(河北外国语职业学院,秦皇岛 066311)

0 引言

随着Internet的普及,互联网逐渐成为人们快速获取、发布和传递信息的重要渠道,它在人们政治、经济、生活等各个方面发挥着重要的作用。Internet上发布信息主要是通过网站来实现的,获取信息也是要在Internet"海洋"中按照一定的检索方式将所需要的信息从网站上下载下来。因此网站建设在Internet应用上的地位显而易见,它已成为政府、企事业单位信息化建设中的重要组成部分,从而倍受人们的重视。Web应用程序得到了很大的发展,企业网站逐渐成为企业信息交流必不可少的策略之一。本文以为公司设计一个企业网站为例,主要以ASP技术为主,从基本的网页结构设计开始,通过Dreamweaver可视化设计功能的辅助,建立一个企业信息交流的平台。

研究的基本内容,拟定目标网站要解决的问题:第一,如何通过网站来宣传公司及其产品;第二,如何用ASP和Dreamweaver来实现网站的动态效果;第三,如何使网站更佳新颖。进行了系统的可行性分析,主要从技术可行性和操作可行性对目标系统进行了分析,得到了目标网站在技术方面和操作方面都是可行的结论。用Access进行了数据库的设计:数据库名称dl。并在该数据库下建立产品展示(tp )、公司信息(gsxx)、联系方式(Lxfs)、招聘信息(zpjj)、登陆信息(lognxx)5个表。

1 绪论

1.1 Active Server Pages概况

随着网络技术的迅猛发展和Internet的日益普及,人们对Web站点建设技术的渴求与日俱增。目前,Microsoft公司推出的ASP广泛流行于业界,利用ASP,可以方便、快捷地创建出动态、交互的Web服务器端应用程序。

Active Server Pages实际上是将标准的HTML文件拓展了一些附加特征,Active Server Pages象标准的HTML文件一样包含HTML对象并且在一个浏览器上解释并显示。任何你可以放在HTML中的东西--Java applets,闪烁字符串,客户端脚本,客户端ActiveX控件等等你都可以放在Active Server Page中。因此,一个Active Server Page具备很强的通用性。

1.2 Dreamweaver概况

Dreamweaver 是一套功能相当强大的网页编辑软件,由Macromedia 公司开发,提供各种可视化的网页编辑功能,从单一的HTML 静态网页,到复杂的ASP动态网页的数据库系统设计,均能够以鼠标拖拽的方式迅速完成网页设计工作。

Dreamweaver 最出色的地方,在于其具备动态服务器网页的可视化设置功能,同时对各类平台与服务器语言提供足够的支持,无论是PHP、JSP、ASP,还是ASP.NET,程序设计人员均能够通过设置,利用Dreamweaver的单一接口,设计不同类型的动态服务器网页。

1.3 Dreamweaver 和ASP

在安装设计完IIS后,不需任何工具,直接使用最简单的文字编辑器,如Windows 自带的“记事本”,就可以设计ASP 网页;事实上无论HTML还是ASP网页,基本上都只是以扩展名命名的纯文本文件。如果是只包含HTML或JavaScript等动态语言的网页,则其扩展名为.html或.htm;但如果是ASP 网页,则其扩展名为.asp。

尽管不需要任何特殊的编辑器就可以ASP 网页的编辑,然而开发用于实际用途的网页时,会包含复杂的程序代码,此时使用一套合适的开发工具可以大幅度地提高编写和管理程序代码的效率。

ASP 网页本身是由传统的HTML网页衍生而来的,其程序代码与HTML标签相互并存,早期的Dreamweaver 只提供编辑HTML 标签的能力,在Dreamweaver MX 2004中,除了维持原先强大的静态网页编辑功能外,还加入了ASP 程序代码的编辑功能,成了一个全功能的网页编辑器。Dreamweaver 除了支持程序代码的编辑之外,对于各种ASP网页应用功能的开发,也提供了可视化的操作模式,用户只需以鼠标拖动并进行设置,即可自动完成程序代码的编写,即使如数据库般应用复杂的操作也能够轻松完成。

2 网站总体分析与设计

对网站进行系统分析,首先对网站进行需求分析,然后对网站进行模块分析,根据公司网站的需求分析,将整个网站分若干个个功能模块。

对系统进行功能模块设计,将整个网站划分为若干个模块后,需要对每个模块的功能进行详细设计。根据模块的功能需求设计模块使用何种方式显示该功能,以及应该包含相应的页面与操作步骤。

对网页进行设计,首先是网页布局,然后是网页的配色。还要记得对网页的数据库进行设计。

3 网站的具体实现

3.1 定义一个网站

定义一个网站,是制作ASP网页之前,首先必须完成的操作。一旦完成网站的定义,Dreamweaver 将可以让程序开发人员直接利用其编辑窗口,以该网站为基础,进行ASP 网页的创建、编辑与测试。

3.2 网站页面的实现

3.2.1 主页的实现

网站主页采用静、动相结合的方式,即静态的主画面和动态的图片相结合,体现公司的勃勃生气。静态主页方式介绍公司的公司简介、领导致辞、荣誉证书、产品展示、销售业绩、招聘英才、留言板、联系我们8个功能模块。就得利用ASP与数据库结合的技术通过数据库对网站进行动态管理,采用交互式的动态的web画面来实现。

图1 网站的主页

主页(index0000.asp)中有八个模块的相关链接以及公司简介、领导致辞、销售业绩等模块内容的简单介绍。网页布局采用“国”字型,在最左侧插入了一个Flash(cemian1.swf),使网页显得很新颖,有动感,并且还在这个Flash中巧妙的插入了公司的联系方式。在主页中,绑定了四个记录集,分别是Recordset1、RecZpjj、Recgsxx和Reclxfs。这四个记录集分别与数据库dl中的产品展示表tp、招聘信息表zpjj、公司信息表gsxx和联系方式表Lxfs相连。这样,把记录集中的相关内容拖放到主页中的相应位置就可以了,使网页上的内容可以动态的进行修改。需要说明的是主页中的图片,也是通过数据库进行插入的,使用和修改起来相当地方便。

利用Dreamweaver中“服务器行为”中的“重复区域”来实现招聘信息的多条显示。先将页面左下方招聘信息表格选种,再点击“应用程序”中的“服务器行为”中的“重复区域”,会弹出一个 “重复区域”对话框。在这个对话框的“记录集”中选择记录集RecZpjj,并在“显示”中选择2条记录。在产品介绍中,也进行同样的操作,只是选择记录集Recordset1,并在显示中选择4条记录。

另外,产品简介中的“其他”用Dreamweaver中“服务器行为”中的“转到详细信息页”命令来链接到详细页面xxxx.asp中。在最下方的图片IMAGES/DE1.gif的文字“版权所有秦皇岛市电力机械有限公司”上,加一个长方形热区Map4,并将其链接到主页index0000.asp。在其他的页面中,也加一个同样的热区。在下面的其他页的实现中,就不一一的进行重复的介绍了。

产品介绍中的产品照片是通过点击“插入”中的“常规”标签中的“图象”,在弹出的对话框“选择图象源”中的“从文件名称选择”选择“数据源”单选按钮,在“域”中,选择记录集Recordset1中的Tp,并将其属性中的,宽设置为:100,高设置为:69。

在图片images/google.gif中,加入文字“管理员登陆”,并将其链接到管理系统中的页面Logon.asp上。可以方便的从主页进入到管理页面中。

3.2.2 其他页的实现

根据对秦皇岛电力机械有限公司网站的模块的划分,将整个网站分为:公司简介、领导致辞、荣誉证书、产品展示、销售业绩、招聘英才、留言板、联系我们和管理系统9个功能模块,并将其具体实现。这里以公司简介页面(index-1.asp)为例。

公司简介页面(index-1.asp)主要是介绍公司的概况,插入了一个Flash(cemian1.swf),绑定了三个记录集分别是RecZpjj、Recgsxx、Reclxfs,让招聘的简单信息与数据库中的表zpjj相连,其他两个记录集分别与数据库dl中的公司信息表gsxx和联系方式表Lxfs相连。然后将Recgsxx.gsxxjs、Recgsxx.gsjs、Recgsxx.xsyj、RecZpjj.Mc、RecZpjj.Rs、RecZpjj.Yq、Reclxfs.dh、Reclxfs.cz和Reclxfs.Email,从其相应的记录集中拖到页面index-1.asp的相应位置。使网页上的内容可以动态的修改。同样要用“应用程序”中的“服务器行为”中的“重复区域”,来实现招聘信息的多条显示,操作步骤与主页相同。

4 结论

随着公司网站的设计完成,本网站中预期的主要功能也基本实现。本网站以Dreamweaver和ASP作为前台开发工具,并以Microsoft Access作为后台数据库,这些都是开发网站的前沿工具成为开发本网站的首选工具。本文阐述了公司网站的分析与设计的全过程,并在论文中相应的位置插入了图片,更加清晰的描述了该网站是如何实现的。

[1] 尚俊杰.网络程序设计——ASP案例教程[M].清华大学出版社,2004.

[2] 魏洪斌,周鑫,刘志江.Dreamweaver MX网页设计[M].清华大学出版社,2005.

[3] 荣钦科技.ASP+Dreamweaver MX 2004数据库网站开发与实例[M].清华大学出版社,2004.

[4] 李严,于亚芳,王国辉.等.ASP数据库开发实例解析[M].机械工业出版社.2004.

[5] 秦学礼.DreamweaverMX2004实用教程[M].清华大学出版社,2004.

[6] 陈建伟.ASP动态网站开发教程(第二版)[M].清华大学出版社,2005.

猜你喜欢
网页页面动态
国内动态
刷新生活的页面
国内动态
国内动态
答案
基于HTML5与CSS3的网页设计技术研究
让Word同时拥有横向页和纵向页
动态
基于CSS的网页导航栏的设计
基于HTML5静态网页设计