《ASP动态网页设计》 实验指导书 系部:信息工程系 专业:计算机应用专业
《ASP 动态网页设计》 实 验 指 导 书 系部：信息工程系 专业：计算机应用专业
录 实验一WND0WS20 SERVER S的安装与配置.12 实验二HM标记符的使用(表格、表单对象、Cs样式) 实验三 JAVASCRIPT语言 实验四 VBSCRIPT编程 实验五ASP内建对象 实验六可安装组件和脚本对象 实验七数据管理的存取操作…… 13
1 目 录 实验一 WINDOWS 2000 SERVER IIS 的安装与配置............................... 2 实验二 HTML 标记符的使用（表格、表单对象、CSS 样式）.............. 3 实验三 JAVASCRIPT 语言................................................................................... 5 实验四 VBSCRIPT 编程........................................................................................ 6 实验五 ASP 内建对象.......................................................................................... 8 实验六 可安装组件和脚本对象.................................................................... 13 实验七 数据管理的存取操作......................................................................... 13
实验一 Windows2000 Server S的安装与配置 实验目的 熟悉PwS的安装过程与配置方法。通过编写简单的ASP页面,掌握ASP网 页的编写和运行方法 实验要求 学生掌握关于动态网页的相关知识;具备制作静态网页的基础;具备一定 的网络基础知识 实验器材 Windows2000 Server计算机系统:安装IIS、 Dreamweaver mX2004、 Access 2000数据库系统等 四、实验内容: l、 ASP Web服务器的安装与配置; [参考步骤]: 1.将 windows2000光盘插入教师机中,将其共享; 2.学生机器将查看自己的IP地址,在网络中配置 3.在添加和删除程序中,添加IS 4.在自己的本地硬盘中用035oft建一文件夹 5.在管理工具中 Internet信息服务中配置IS 6.运行 Dreamweaver mx204建立站点,完成相关的设置,其中根目录与Is中 致,并使用服务器技术 7.新建一个网页,互相访问; 2、调试ASP页面显示:“这是利用ASP网页输出的信息”; [参考步骤 1.启动 Dreamweaver MX2004,然后切换到源代码显示方式 2.在<body>与</body>之间,加入以下ASP代码 3.<‰ Response. write(“这是利用ASP网页输出的信息”)%> 4.将网页保存到C: netpub\wwwroot目录下,文件命名为 first.asp
2 实验一 Windows 2000 Server IIS 的安装与配置 一、实验目的： 熟悉 PWS 的安装过程与配置方法。通过编写简单的 ASP 页面，掌握 ASP 网 页的编写和运行方法。 二、实验要求： 学生掌握关于动态网页的相关知识；具备制作静态网页的基础；具备一定 的网络基础知识。 三、实验器材： Windows 2000 Server 计算机系统；安装 IIS、Dreamweaver MX 2004、Access 2000 数据库系统等。 四、实验内容： 1、ASP Web 服务器的安装与配置； [参考步骤]： 1. 将 windows 2000 光盘插入教师机中，将其共享； 2. 学生机器将查看自己的 IP 地址，在网络中配置； 3. 在添加和删除程序中，添加 IIS； 4. 在自己的本地硬盘中用 03soft 建一文件夹； 5. 在管理工具中 Internet 信息服务中配置 IIS； 6. 运行 Dreamweaver MX 2004 建立站点，完成相关的设置，其中根目录与 IIS 中 一致，并使用服务器技术； 7. 新建一个网页，互相访问； 2、调试 ASP 页面显示： “这是利用 ASP 网页输出的信息”； [参考步骤]： 1. 启动 Dreamweaver MX 2004，然后切换到源代码显示方式； 2. 在<body>与</body>之间，加入以下 ASP 代码： 3. <%Response.write(“这是利用 ASP 网页输出的信息”)%>； 4. 将网页保存到 C：\Inetpub\wwwroot 目录下，文件命名为 first.asp；
5.启动I浏览器,在地址栏中键入:http://localhost/first.asp或 http://127.0.0.1/first.asp然后按回车。注意观察输出结果; 6.在 wwwroot目录下创建一个myeb子目录,并将 first.asp文件移动到 myweb 目录下,然后在浏览器中键入http://locAlhost/myweb/first.asp 实验二HTML标记符的使用(表格、表单对象、SS样式) 一、实验目的: 熟悉并掌握HM标记符的用法和功能。掌握HML网页的基本结构,学会 利用HML标记符来编写简单的网页,达到能够编写和阅读HML网页源代码的目 的 二、实验要求: 学。学生掌握关于mMu的相关知识具备制作静态网页的基础:具备一定的网 础知识。 三、实验器材: Windows2000 Server计算机系统;安装IIS、 Dreamweaver mX2004、 Access 2000数据库系统等。 四、实验内容: 、试用记事本编写一个名为 myfirst.hm的页面,并在网页中以标题2号 字,居中,蓝色输出“ Hypertext Mark- up language”,页面的标题设置为“网 页测试”。 2、编写一页面,设置页面背景图为bg.jpg,在页面中居中显示名为 myphoto.jpg的图形文件。 3、编写一页面,在页面中显示输出图2.12所示的表格,表格的宽度为450, 边线宽度为1. 单元格11 单元格12 单元格13 单元格21 单元格22 单元格31 单元格32 [参考代码 <table width ="450"border="1"align ="center"> <tr> < td width="113”>< div align=" center">单元格11</dv></td> < td width="153">< div align=" center">单元格12</di></td> < td width="162">< div align=" center">单元格13</div></td> /tr <tr> < td rowspan="2">< div align=" center">单元格21</div></d> < td colspan="2">< div align=" center">单元格22</div></d>
3 5. 启 动 IE 浏 览 器 ， 在 地 址 栏 中 键 入 ： http://localhost/first.asp 或 http://127.0.0.1/first.asp，然后按回车。注意观察输出结果； 6. 在 wwwroot 目录下创建一个 myweb 子目录，并将 first.asp 文件移动到 myweb 目录下，然后在浏览器中键入 http://Localhost/myweb/first.asp； 实验二 HTML 标记符的使用（表格、表单对象、CSS 样式） 一、实验目的： 熟悉并掌握 HTML 标记符的用法和功能。掌握 HTML 网页的基本结构，学会 利用 HTML 标记符来编写简单的网页，达到能够编写和阅读 HTML 网页源代码的目 的。 二、实验要求： 学生掌握关于 HTML 的相关知识；具备制作静态网页的基础；具备一定的网 络基础知识。 三、实验器材： Windows 2000 Server 计算机系统；安装 IIS、Dreamweaver MX 2004、Access 2000 数据库系统等。 四、实验内容： 1、试用记事本编写一个名为 myfirst.htm 的页面，并在网页中以标题 2 号 字，居中，蓝色输出“Hypertext Mark-up Language”,页面的标题设置为“网 页测试”。 2、编写一页面，设置页面背景图为 bg.jpg，在页面中居中显示名为 myphoto.jpg 的图形文件。 3、编写一页面，在页面中显示输出图 2.12 所示的表格，表格的宽度为 450， 边线宽度为 1. 单元格 11 单元格 12 单元格 13 单元格 21 单元格 22 单元格 31 单元格 32 [参考代码] <table width="450" border="1" align="center"> <tr> <td width="113"><div align="center">单元格 11</div></td> <td width="153"><div align="center">单元格 12</div></td> <td width="162"><div align="center">单元格 13</div></td> </tr> <tr> <td rowspan="2"><div align="center">单元格 21</div></td> <td colspan="2"><div align="center">单元格 22</div></td> </tr>
<tr> <td>< div align=" center">单元格31</di></td> td>< div align=" center">单元格32</div></td> ctable> 4、编写用户登陆界面,“用户登陆”采用标题2、居中输出,网页标题设置 为“用户登陆”。“用户名”“口令”以及按钮全部要求居中对齐,用户名和口令 输入框的默认值均为 guest。表单对象命名为 login,提交方法采用post,表单 数据提交给 login.asp页面处理,最后将网页保存为 login.htm,并用浏览器浏 览 用户登录 用户名 口令:匚 确定重填 [参考代码 <html> metahttp-equiv="content-type"content=texT/html;charset=gb2312"> <tte>用户登录</ title> </head> <form name="form1"method="post"action ="login. asp"> <table width="450"border="0"align=center"> <td colspan =2 <h2aign=" center'>用户登录</h2></td> < td width="204">< div align=" center">用户名:</div></td> <td width=236"> <input name="textfield" type="text"value="guest"> /tr> <td>< div align=" center>口令:</div></td> <input name="textfield" type="password"value="guest"> </dv></td> <td colspan=2"> <div align=center"> <input type="submit"name="Submit"value=WfAE"> r siput type="reset"name="Submit2"value="TEt"> /div></td>
4 <tr> <td><div align="center">单元格 31</div></td> <td><div align="center">单元格 32</div></td> </tr> </table> 4、编写用户登陆界面，“用户登陆”采用标题 2、居中输出，网页标题设置 为“用户登陆”。“用户名”、“口令”以及按钮全部要求居中对齐，用户名和口令 输入框的默认值均为 guest。表单对象命名为 login，提交方法采用 post，表单 数据提交给 login.asp 页面处理，最后将网页保存为 login.htm，并用浏览器浏 览。 用 户 登 录 用户名： 口 令： 确定 重填 [参考代码] <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>用户登录</title> </head> <body> <form name="form1" method="post" action="login.asp"> <table width="450" border="0" align="center"> <tr> <td colspan="2"> <h2 align="center">用户登录</h2></td> </tr> <tr> <td width="204"><div align="center">用户名：</div></td> <td width="236"> <div align="center"> <input name="textfield" type="text" value="guest"> </div></td> </tr> <tr> <td><div align="center">口令：</div></td> <td> <div align="center"> <input name="textfield2" type="password" value="guest"> </div></td> </tr> <tr> <td colspan="2"> <div align="center"> <input type="submit" name="Submit" value="确定"> <input type="reset" name="Submit2" value="重填"> </div></td>