网页制作基础概念    Flash动画制作    Javascript实例    Photoshop网页图片实例    GIF动画制作

网站网页制作技巧

  返回目录
 

让你的网页动起来

罗列异

  当你倘徉过Internet的万顷碧波后,你可能有意为自己建造精美的网居。但是,在你建网居时,你会发现你的网页是“静止”的,如果你不去更新网页的话,网页的内容将不会更变;同时,你的网页也是单向的,缺少交互性,不能根据访问者的需要而改变。
怎么让网页“动”起来呢?
  你可能会认为这需要高超的编程技巧,比如通过CGI(Common Gateway Interface)来实现。的确,借助CGI,我们可以编写出动态的网页内容。但是,CGI有许多致命的弱点:编程复杂,修改也很困难;执行效率不高,对每一个表单都需要单独,如果多个同时执行,WEB服务器的执行速度可想而知。那么,用什么可以既简单又方便地让你的网页动起来呢?
  使用ASP技术可以轻轻松松地办到!ASP是Active Server Pages的缩写,它提供一个服务器执行脚本的环境,您可以使用HTML网页、ASP指令和ActiveX控件,以产生和执行动态、交互、高效率的Web服务器应用程序。
  ASP网页设计与普通网页设计相似,它只是在普通网页HTML语法基础上增加了ASP语句,为了区别, 用定界符<% . . .%>把ASP的脚本括起来。ASP语句在服务器中执行,执行后产生标准的HTML码, 再传送给客户端浏览器。这样也就减轻了浏览器的负担,大大提高了交互的速度。访问者只要使用象IE、Netscape等html码的浏览器,就可以浏览Active Server Pages所设计的网页内容。让我们开始尝试着用ASP来设计你的网页吧!可是,到哪里找执行ASP网页的服务器?
把服务器搬回家
  精心设计网居,调试ASP脚本是个很费时间的过程,高额的上网费用会令人瞠目。那么,把服务器搬回家,怎么样?
  这并非天方夜谭,使用微软的PWS(Microsoft Personal Web Server)就能办到(如果你使用NT的话,你只要安装Microsoft Internet information server就行了)。
  下面就让我们在自己的计算机上建立服务器!如果你已经安装了FrontPage98的话,它的默认安装中已经包括了PWS,它提供HTTP和FTP,两种基本网络服务,但这个版本不支持ASP功能。我们可以从Windows 98光盘的\add-ons\pws中安装我们需要的PWS。
  如果在安装PWS时,选择了FrontPage 98 Server Extentions的安装,启动FrontPage安装,创建或打开网站时会提示端口被占用。这是因为安装了两个服务器,同时它们的服务端口都是80,这时最简单的办法是把以前安装的服务器删除。运行FrontPage Server Administrator,把不要的uninstall就行了。
  配置好了,我们在PWS上用FrontPage创建一个Web主页,如http://Localhost/yourweb。如果你的计算机没有联网,Locahost就只能是你主机的名称,yourweb是你新建网站的名字。
  如果你的设置正确,那么打开Internet explore,在地址栏中键入http://Localhost/yourweb后就会看见以下的内容:目录列表被拒此虚拟目录不允许列出内容
  这就说明你的服务器成功建立了!
  顺便提及,以上建立的PWS的主目录是在\InetPub\wwwroot,当然你可以通过任务栏上PWS管理器的高级选项更改主目录的位置。
牛刀小试
  ASP真的这么神奇吗?让我们感受一下它的威力。我们设想要实现这样一个功能:访问者键入他的出生年份,系统自动识别他所属的生肖,并把生肖动物显示出来。这样一个功能,采用传统的HTML是无法办到的。但是使用ASP,轻轻松松地办到。
  我们在刚才创建的FrontPage中网站上添加一个新的页面,默认的名字是Default.asp。在页面中插入一个单行文本的表单域和两个按钮,文本取名为text。按钮的类型设置成“提交”,点取表单属性按钮,在“表单结果做什么”中设置为“发送到其他”,内容是“自定义ISAP、NSAP、CGI、或ASP脚本”;设置选项,在自定义表单处理程序的设置对话框的操作栏中输入test.asp,方法是POST确定退出。
  我们继续添加一个新的页面,取名为test.asp在FrontPage编辑器中html属性页中输入以下内容:
<html>
<head> <title>猜猜你的生肖</title>
</head>
<body>
<% dim year,pic,txt
  year=request.form("text")mod 12
  select case year
  case 1:pic="chicken"
  txt ="鸡"
  case 2:pic="dog"
  txt ="狗"
  case 3:pic ="pig"
  txt ="猪"
  case 4:pic = "mouse"
  txt="鼠"
  ……
  end select
  pic = pic & ".gif"
%>
<div align="center"> <center>
<table border ="2" cellspacing ="5" width="100%">
<tr>
  <td width="100%"> <img src="<% = pic%>">
  </td>
</tr>
</table>
</center> </div>
<p> 原来你是瞩<% =txt % >的!</p>
<p> <font color ="#FF0000">哈哈哈!</font> </p>
</body>
</html>
  为了运行这个程序,你还必须去找12种动物的图像文件,把他们分别取个好记的名字。
  让我们来分析一下test.asp,你会发现同一般的HTML脚本比较,它多了两个符号<%和%>,这就是ASP的定界符,中间的代码就是ASP语句,熟悉Visual Basic的朋友一定会发现,它的语法就是VB Script。其实,ASP的脚本语言可以是任何Script语言,当你安装PWS时,系统提供了两种脚本语言VBScript和JavaScript,你甚至还可以通过相应的引擎,使用由第三方所提供的其他脚本语言,如Perl等。
  使用ASP很大的优点就是它能使用户与页面之间动态地交换信息,但是它是怎样获取用户的信息呢?其实是通过嵌在WWW页面的表单来完成的。表单接受访问者输入的出生年份,然后由表单的POST方法执行提交动作,把数据传给服务器,再由服务器把数据传给接受数据的ASP程序。
对于表单提交数据通常有两种方法:
POST方法:数据被送到WWW服务器的STDOUT中。
GET方法:客户端将数据送到地址URL后,格式为(?名字 1=数值 1&名字 2=数值2 &...),WWW服务器将把数据放在环境变量QUERY_STRING中。
ASP端数据接收:由于ASP采取面向对象的思想,浏览器传来的数据都封装在其内建对象Request中。
1.对POST方法:使用变量数值=Request.Form("表单域名")或Request.("表单域名"),读取网页中表单域的数据。
2.对GET方法:使用变量数值=Request.QueryString("表单域名")或Request.("表单域名"),将附加在URL地址后的信息取出。
  在例子中,由于表单是通过POST方法来提交数据的,所以我们在test.asp中采取FORM方法来获取访问者的出生年份,year=request.form("text")。这样我们就已经取得出生年份,由于生肖是以12为循环的,因此取它与12的余数0-11之间的数值分别代表一肖,如0代表猴,4代表老鼠。Pic变量存放着每一肖的图像文件名,txt变量存放着属肖名。再看显示生肖动物的图像语句,<img src="<%= pic%>">,这里pic是个变量,所以被括在ASP定界符之内,请注意它的书写格式。
  现在,我们已经对ASP有了初步的了解,那么就写一个有用的ASP程序。
做个计数器
  计数器是网居中一大法宝,它如同一面镜子告诉你有多少人访问你的网居,你的网居是车水马龙还是门可罗雀,一望而知。以前,我们使用的计数器大多是主页空间提供商提供的,那么让我们自己设计一个计数器,如何?
  首先你必须找从0-9的10幅图片,分别取名0.gif(jpg),1.gif(jpg)……什么,没有这样的图片!驾“猫”出海吧,几乎各个提供主页空间的都提供计数器服务,他们大多都有计数器的样本供用户选择参考;把你所喜欢的一组样本统统的Down下来就行了。什么,都不满意!那下你只好回家自己用Photoshop做一组了。
  下面这段代码就是使用ASP设计的计数器的代码。
<% dim visitors
''''打开计数文件
countfile = server.mappath("..\public\count.txt")
Set fs = CreateObject("Scripting.FileSystemObject")
set thisfile = fs.OpenTextFile(countfile)
''''读计数器中当前计数值
visitors = thisfile.readline
thisfile.close
''''显示当前计数值
countlen = len(visitors)
for i = 1 to 6-countlen
response.write "<img src =../images/0.gif>"
next
for i = l to countlen
response.write "<img src =../images/" & mid(visitors,i,1)& ".gif>"
next
''''计数值加1,回存到计数文件
visitors = visitors + 1
Set thisfile = fs.CreateTextFile(countfile)
thisfile.WriteLine(visitors)
thisfile.close
set fs = nothing
%>
  只要你对VB熟悉的话,参考文中的注释,相信这段代码是不难阅读的。这里主要分析ASP对文件的操作,VB和HTML的内容就不赘述了。首先,由于我们不知道数据文件的物理存放路
径,因此要将数据文件的相对路径映射到服务器上相应的物理目录上。这里采用ASP内建的Server对象,Server对象提供对服务器上的方法和属性的访问。有了Server对象,你就可以在服务器上启动ActiveX对象例程了。它的Mappath方法提供了映射路径的方法。Physical_Path = server.mappath(path),这里path是指定要映射物理目录的相对或虚拟路径,返回Physical_Path是同asp文件中已有的路径相对的物理路径。
  接下来,就要对文件进行读写存取操作。ActiveX中提供了File Access Component(即FileSystemObject文件存取控件)。首先必须建立文件存取控件的对象,Set fs = CreateObject("Scripting.FileSystemObject"),定义fs是FileSystemObjectde的对象的实例,接下来我们就可以使用它的属性方法进行对文件进行存取操作了。File Access Component控件提供了一些控制文件存取的方法,如:
  CreateTextFile方法,打开一个已经存在的文件,并建立一个TextStream对象;
  OpenTextFile方法,建立一个TextStream对象,并指向指定文件名或目录。
  实际上从例子中我们已经看到了,文件存取控件必须使用TextStream对象来操作文件的,例子中的thisfile就是该对象的实例,可以使用readline来读取一行信息,Writeline写入一行信息,Close关闭该对象。
  ASP是不是很有意思。让我们来做个留言簿吧!
留言簿的制作
  留言簿是网居的又一法宝。客人到你网居来做客,主人不在,客人欣赏完你的居室,或者自助地拿了点东西后,总得有所表白,在留言簿上留下几句话。
  留言簿的编写实际上把刚才我们学的两个例子综合起来,它既有表单提交,又有对文件的操作。请看下面的代码。
  首先在Frontpage中创建一个表单,供访问者输入自己的姓名、邮件地址和留言。首先插入两个单行文本框的表单域,分别取名为Name、Email,然后再插入滚动文本框,取名为ly,最后再加入一个按钮,类型为“提交”,在自定义表单处理程序的设置对话框的操作栏中输入lyb.asp,方法是POST。然后,创建yb.asp,其代码如下:
<% dim input()
name = Request.Form("name")
email = Request.Form("email")
sj = Year(date()) & "-" & Month(date()) & "-" & Day(date())
sj =sj & "" & Hour(Time())& ":" & Minute(Time()) & ":" & Second(Time())
If Request.Form("ly") = "" then
Response.write("留言不能不输吧!请留下你的墨宝!")
Response.end
else
ly = Request.Form ("ly")
end if
''''把文件内容读到input()数组中
lyfile = server.mappath("..\public\clyb.htm")
Set fs = CreateObject("Scripting.FileSystemObject")
Set thisfile = fs.openTextFile(lyfile,1, False)
counter = 0
do while not thisfile.AtEndOfStream
thisline = thisfile.readline
Redim preserve input(counter)
input(counter) = thislihe
counter = counter + 1
loop
thisfile.Close
''''创建新文件,保存留言数据
Set outfile = fs.CreateTextFile(lyfile)
for each item in input
If item = "<! - - insert here - - > " then
outfile.WriteLine " <! - - insert here - - > "
outfile.WriteLine", <ul>"
if name <> "" then
outfile.WriteLine" <li> <strong>"
outfile.WriteLine " 姓名:" & xm
outfile.WriteLine" </strong> </li>"
end if
if email <> "" then
outfile.WriteLine " <li> <strong>"
outfile.WriteLine "信箱: <a href = ''''mailto:" & email & "''''> " & email & " </a>"
outfile.WriteLine" </strong> </li> "
end if
outfile.WriteLine" <li> <strong>"
outfile.WriteLine" 留于:" & sj
outfile.WriteLine" </strong> </li> "
outfile.WriteLine" <li> <strong>"
outfile.WtiteLine" 留言:"
outfile.WriteLine" </strong> </li>"
outfile.WriteLine" " & ly & "</ul>"
outfile.WriteLine" <hr>"
else
outfile.WriteLine item
end if
next
outfile.close
set fs =nothing
%>
分享你的数据
  其实,使用ASP技术最精妙之处还在于它提供方便地访问数据库的功能,从而使得开发基于WWW的应用软件系统成为可能,如图书馆信息检索系统,网上购物,主页空间提供商管理用户,跨地域的公司内的业务网,网上资料库等等。
  其实,在你的网页设计中只要合理使用数据库,就会让你的网页更方便,更有特色,也更专业。举例而言,如留言簿可以使用数据库,自助式友情链接,网友(同学)通讯录,软件仓库等等,只要你想得到的,都可以采用数据库技术。
  一般来说,ASP访问数据库有三种方式:传统的IDC(Internet数据库接口)方式,ADO(Activex数据对象)方式以及最新RDS(以远程数据服务)方式。这里我们以常用的ADO方式来说明如何来编写基于WWW的数据库应用软件。
  由于ADO使用本地数据源,所以它能访问任何支持ODBC的数据库,这里的例子是采用Access数据库,其实像SQL server、Foxpro等也都能访问。在ASP中,ADO可以看做是一个服务器组件,它包括Command、Connection、Recordset等七个对象和一个动态的Properities属性集合,合理组合可以完成几乎所有的数据库访问工作。
  我们使用Access创建了一个古典诗词的数据库,数据库由作者、作者生活的朝代、作品名字,作品类型和作品内容等构成一张表(诗词),现在我们要对这个数据库进行维护和操作,譬如要查询作者是宋代的,作品内容中包括“起舞弄清影,何似在人间”的诗句。
  下面我们把这个数据库添加到ODBC数据源中,创建数据源名DSN(Data Source Name),取名为poem。我们可以把DSN看成是应用程序和数据库之间的桥梁,只要告诉DSN到底操作的是哪一个数据库。就可以通过ODBC访问数据库。我们在FrontPage编辑器中HTML窗口中编写一段代码:
<% ''''使用DNS方式编写数据库
strDSN = “DSN = poem"
''''创建数据库链接
Set cn = Server.CreateObject("ADODB.Connection")
cn.Open strDSN
''''创建数据对象
Set rs = Server.CreateObject("ADODB.Recordset")
''''操作数据库
strSQL = "SELECT * FROM 诗词 where 朝代 = ''''宋'''' and 内容
like ''''%起舞弄清影,何似在人间%'''' order by 作者 "
Set rs = cn.Execute(strSQL)
set objName = rs ("名字")
set objAuthor =re ("作者")
set objDns =rs("朝代") %>
<! - 下面是显示各字段内容 - - >
<table border="1" width = "90%" >
<% De until rs.EOF %>
<tr>
<td>
<p align="center"> <% Response.Write objName%>
</td>
<td>
<p align ="*center"> <% Response.Write objAuthor%>
</td>
<td>
<p align="center"> <% Response.Write objDna%>
</td>
</tr>
<% rs.MoveNext
Loop %>
</table>
  仔细阅读上面一段代码我们不难发现,ADO操作数据库其实很简单,它是通过SQL语句来实现的。你只要熟悉SQL,能书写一些SQL语句就可以了。SQL即Structured Query Language结构式查询语言的缩写,是当今国际计算机数据库的标准语言,广泛用于如SQL Server、Oracal Sybase和DB2等流行的关系数据库。
  数据库通过执行Execute方法来将查询结果返回给一个数据对象rs,它包括数据库诗词表中的各个字段,我们只取名字、朝代和作者三个字段,然后把这三个字段的内容显示出来。我们这里采用了ASP的另一个内建对象Response,该对象是用来控制发送给用户的信息。Write方法是我们平时最常用的方法之一,它是将指定的字符串写到当前的HTTP输出。
  上面介绍了开发基于WWW数据库的应用软件的基本编程思路。如果你对数据库感兴趣,不妨建立一个基于数据库的ASP留言簿。
  其实,在考虑开发这方面的应用软件时,应包括如数据库日常维护模块、数据追加模块、数据分级查询模块等等,同时数据库本身的安全性问题也很重要。
  另外在个人网页设计时使用数据库,由于需要DNS,这就需要服务器的系统管理员在服务器ODBC上设置DSN,所以实际编程时并不用DSN建立连接。
  以上介绍了ASP技术组建个人网页常见的一些问题,供大家参考。有兴趣的朋友可以写信给我Lieyi@usa.net,一起交流。
文章版权或来源:电脑爱好者

Copyright 2000-02 © 企改探索 All rights reserved.大希个人主页版权所有 本站由成都市金牛区体改委刘达希 编辑制作
Chengdu city. Suchuan province. The People's  Republic of  China