Web开发技术实验指导书.docx

《Web开发技术实验指导书.docx》由会员分享，可在线阅读，更多相关《Web开发技术实验指导书.docx（119页珍藏版）》请在冰豆网上搜索。

Web开发技术实验指导书

安徽农业大学《Web开发技术》JSP版课程配套教材

《Web开发技术》实验指导书

（JSP版）

刘波编写

安徽农业大学信息与计算机学院

通信工程

2008年2月

实验报告………………………………………………………………………..76

实验一搭建JSP运行的实验环境

一、实验目的

（1）掌握JSP运行环境的安装与配置

（2）理解JSP与Servlet的关系

（3）运行简单的JSP页面，理解JSP的运行原理

二、实验工具

（1）JDK1.4、JDK1.5或JDK1.6，可以从SUN公司的网站免费下载

（2）编辑工具－记事本

（3）Tomcat服务器，也可以从网上免费下载

三、实验步骤

（1）按教材中演示安装JDK

（2）按教材中演示安装Tomcat

（3）启动Tomcat服务器，在浏览器中输入：

http:

//localhost:

8080，观察主页内容

（4）观察Tomcat安装目录下的各个子目录的内容

（5）打开记事本，输入下列源代码并保存为exer1.jsp。

将此文件复制到Tomcat安装目录下的webapps\ROOT目录下，运行该页面，观察其对应的Servlet源代码。

exer1.jsp的代码：

<%@pagecontentType="text/html;charset=GB2312"%>

--jsp指令标签-->

<%@pageimport="java.util.Date"%>

--jsp指令标签-->

<%!

Datedate;//数据声明

intsum;

publicintadd（intm,intn）//方法声明

{returnm+n;

}

%>

—html标记-->

程序片创建Date对象：

<%Datedate=newDate（）;//java程序片

out.println（"
"+date）;

sum=add（12,34）;

%>

在下一行输出和:

<%=sum+100%>

--Java表达式-->

（6）将exer1.jsp文件复制到Tomcat安装目录下的webapps\examples目录下，运行该页面，观察其对应的Servlet源代码。

（7）将exer1.jsp文件复制到Tomcat安装目录下的webapps\webdav目录下，运行该页面，观察其对应的Servlet源代码。

四、实验思考题

（1）JDK安装完毕后，需要添加哪些环境变量？

（2）在Tomcat安装目录下的webapps文件夹中，新建一文件夹myapp，将exer1.jsp文件复制到Tomcat安装目录下的webapps\myapp目录下，运行该页面（http:

//localhost:

8080/myapp/exer1.jsp），结果如何？

若在d:

盘根目录建立一个文件夹myweb，将exer1.jsp文件复制到d:

\myweb\目录下,运行该页面（http:

//localhost:

8080/myweb/exer1.jsp），结果如何？

若要正确显示该页面，还应做如何处理？

提示：

修改conf目录下的server.xml文件。

（3）Tomcat默认端口号为8080，如何更改端口号？

（4）编写一个JSP页面，用于显示1～100的整数和。

五、实验报告要求

（1）分析JSP的工作原理，说明JSP文件和Servlet的关系

（2）根据实验运行情况，对实验步骤和运行结果进行阐述

（3）完成实验思考题的解答

实验二JSP页面

一、实验目的

（1）熟悉典型JSP页面的组成元素，掌握HTML标记和JSP标记的不同

（2）掌握在HTML页面中插入JSP脚本（java代码）的方法

（2）编写简单的JSP页面，初步掌握JSP网页的设计原理

二、实验工具

（1）JDK1.4、JDK1.5或JDK1.6，可以从SUN公司的网站免费下载

（2）编辑工具：

记事本或DreamweaverMX2004、FrontPage2003

（3）Tomcat服务器，也可以从网上免费下载

三、实验步骤

（1）打开记事本，输入以下代码，保存为exer2_1.jsp，观察其运行结果

exer2_1.jsp：

<%@pagecontentType="text/html;Charset=GB2312"%>

<%!

intcount=0;//被客户共享的count

synchronizedvoidsetCount（）//synchronized修饰的方法

{count++;

}

%>

<%setCount（）;

out.println（"您是第"+count+"个访问本站的客户"）;

%>

（2）JSP中声明类（比较教材P15－P16页的声明变量和声明方法）是JSP页面对应的Servlet类的内部类，页面上所有脚本元素都可以创建该类的对象。

下面的实例定义一个square类，当客户访问该页面时，服务器创建该类的对象，只要客户给出正方形的边长，就可以求出该正方形的周长和面积，创建并运行exer2_2.jsp，观察运行结果

exer2_2.jsp：

<%@pagecontentType="text/html;charset=gb2312"%>

请输入正方形边长

<%!

publicclasssquare

{doubler;

square（doubler）{this.r=r;}

doublegetarea（）{returnr*r;}

doublegetlength（）{returnr*4;}

}

%>

<%

Strings=request.getParameter（"cat"）;

doubler;

if（s!

=null）

{r=Double.valueOf（s）.doubleValue（）;}

else

{r=1;}

squarecc=newsquare（r）;//创建对象

%>

方的面积是：

<%=cc.getarea（）%>

方的周长是：

<%=cc.getlength（）%>

（3）编写exer2_3.jsp，熟悉在“<%=”和“%>”之间插入表达式，用于输出表达式计算结果的方法

exer2_3.jsp：

<%@pagecontentType="text/html;charset=GB2312"%>

Sin（0.9）除以3等于

<%=Math.sin（0.90）/3%>

3的平方是：

<%=Math.pow（3,2）%>

12345679乘72等于

<%=12345679*72%>

5的平方根等于

<%=Math.sqrt（5）%>

99大于100吗？

回答：

<%=99>100%>

（4）在Dreamweaver或FrontPage中利用可视化方法，编写input.jsp和receive.jsp。

input.jsp：

<%@pagecontentType="text/html;Charset=GB2312"%>

请输入下列信息：

输入您的姓名:

选择性别:

男

女

选择您喜欢的歌手:

张歌手

李歌手

刘歌手

王歌手

receive.jsp：

<%@pagecontentType="text/html;Charset=GB2312"%>

<%StringyourName=request.getParameter（"name"）;//获取text提交的值

StringyourSex=request.getParameter（"R"）;//获取radio提交的值

StringsecretMess=request.getParameter（"secret"）;//获取hidden提交的值

StringpersonName[]=request.getParameterValues（"superstar"）;//获取checkbox提交的值

out.println（"

您的姓名:

"+yourName+"

out.println（"

您的性别:

"+yourSex+"

out.println（"

您喜欢的歌手:

"）;

if（personName==null）

{out.print（"一个都不喜欢"）;

}

else

{for（intk=0;k

{out.println（""+personName[k]）;

}

}

out.println（"

hidden提交的值:

"+secretMess）;

%>

四、设计性实验环节

（1）编写一个jiecheng类，当客户在浏览器中给出指定的正整数N，能计算N的阶乘。

创建能实现此功能的jsp文件res1.jsp，观察运行结果（参考exer2_2.jsp）

（2）编写程序newclass2.jsp，学会在声明中定义类student，初始化该类（学号、姓名、成绩），用表格形式输出“班号（学号的前4位）、学号、姓名、成绩”。

（选做）

五、实验报告要求

（1）分析JSP的脚本元素，说明JSP标记和html标记的不同

（2）根据实验运行情况，对实验步骤和运行结果进行阐述

（3）完成实验设计题的解答

实验三显示不同大小的“你好JSP”（选做）

一、实验目的

（1）掌握控制字体显示大小的方法

（2）掌握For语句，显示变量值

二、实验工具

（1）JDK1.4、JDK1.5或JDK1.6，可以从SUN公司的网站免费下载

（2）编辑工具：

记事本或DreamweaverMX2004、FrontPage2003

（3）Tomcat服务器，也可以从网上免费下载

三、实验原理和内容

本程序运行后，在浏览器页面上显示不同字体大小的“你好Jsp”，如图3－1所示，程序的流程图如图3－2所示。

1、程序知识点

●显示变量值

在JSP中，获取变量值可使用“<%=valname%>”来实现，valname可以是一个整型字符型的变量。

图3－1浏览器显示不同字体大小

●For语句

For语句的格式如下

for（initializationStatement;conditionalExpression;incrementStatement）

{loopBody

}

为了执行For语句，首先执行初始化语句，然后再对条件表达式求值，如果值为TRUE，则执行循环体，随后执行递增语句。

表达式的求值和循环体与递增语句的执行不断重复，直到条件表达式的值变为false。

多个初始化和增量语句可以用逗号隔开。

For循环的初始化部分可以声明局部循环变量，循环变量的范围在循环体内部。

这些循环变量遵循在块内有效的一般规则，即用大括号作为程序块，变量在块内声明，不能与范围外边的变量同名，也不能在循环外引用。

图3－2程序流程图

●控制字体大小

在HTML语言中，控制文字大小可使用“”（n从1－6），因此，可以使用循环语句来控制n的变化。

然后，使用>，来显示字体大小渐变的“你好JSP”

2、程序代码（exer3.jsp）

<%@pagecontentType="text/html;charset=gb2312"language="java"%>

3、观察运行结果

四、综合设计实验环节

综合思考：

结合实验二和实验三，编写input2.jsp和receieve2.jsp，根据变量和for循环生成表格的行和列，结果如下图3－3和图3－4所示：

图3－3input2.jsp执行结果图3－4执行“确定”后结果

五、实验报告要求

（1）根据实验运行情况，对实验步骤和运行结果进行阐述

（2）完成综合设计环节的解答

实验四JSP指令和动作

一、实验目的

（1）综合掌握在JSP中使用指令标记

（2）综合掌握在JSP中使用动作标记

二、实验工具

（1）JDK1.4、JDK1.5或JDK1.6，可以从SUN公司的网站免费下载

（2）编辑工具：

记事本或DreamweaverMX2004、FrontPage2003

（3）Tomcat服务器，也可以从网上免费下载

三、实验步骤

1、Page指令的使用

（1）打开记事本，输入以下文档，并保存为pagederictive.jsp。

<%@pagecontentType="text/html;charset=gb2312"language="java"import="java.util.*,java.rmi.*"session="true"buffer="12kb"autoFlush="true"info="mypagedirectoryjsp"errorPage="false"isThreadSafe="false"%>

Done

ThisprogramexamplehowtousepageDirective

（2）将pagederictive.jsp复制到Tomcate安装目录下的webapps\ROOT\。

（3）在IE地址栏输入http:

//localhost:

8080/pagederictive.jsp

2、page指令import属性的使用

（1）打开记事本，输入以下文档，并保存为pageimport.jsp。

<%--getYear--%>

<%@pageimport="java.util.*"%>

CurrentYear=<%=Calendar.getInstance（）.get（Calendar.YEAR）%>

（2）将pageimport.jsp复制到Tomcate安装目录下的webapps\ROOT\。

（3）在IE地址栏输入http:

//localhost:

8080/pageimport.jsp

3、include指令的使用

（1）打开记事本，输入以下文档，并保存为copyright.jsp。

<%!

StringcompanyName="SSIConsulting";%>

©2002<%=companyName%>

Anyunauthorizeduseofthesematerialswillbeprosecutedtothefullestextentofthelaw

（2）打开记事本，输入以下文档，并保存为inc1.jsp。

<%@pagecontentType="text/html;charset=gb2312"language="java"%>

Thispageisundecontruction

<%@includefile="copyright.jsp"%>

Lastupdated:

March2008

（3）将copyright.jsp和inc1.jsp复制到Tomcate安装目录下的webapps\ROOT\

（4）在IE地址栏输入http:

//localhost:

8080/inc1.jsp

四、设计性实验环节

（1）、编写JSP页面，用“*”显示一个7×7方阵的边框和对角线，结果如图4－1所示。

*******

****

****

***

****

****

*******

图4－1练习1运行结果

（2）、编写JSP页面，判断字符串是否为回文，并用表格显示出来，结果如图4－2所示。

提示：

使用StringBuffer类的reverse（）颠倒某字符串的顺序，若字符串与颠倒后的字符串相等，则该串为回文。

（选做）

图4－2练习2的运行结果

（3）、张三手头分别有800美元和1860美元，编写一个JSP页面，把他的美元换成人民币，并用表格显示出来。

假设当前美元兑换人民币的汇率是7.82。

（选做）

（4）、编写JSP页面分别显示1～10之间的各数字的阶乘。

实验五Tag文件的代码复用

一、实验目的

（1）Tag文件的编写、保存以及Tag标记的使用

（2）编写JSP页面，使用Tag标记实现代码的复用

二、实验工具

（1）JDK1.4、JDK1.5或JDK1.6，可以从SUN公司的网站免费下载

（2）编辑工具：

记事本或DreamweaverMX2004、FrontPage2003

（3）Tomcat服务器，也可以从网上免费下载

三、实验步骤

（1）Tag文件是扩展名为.tag的文本文件，其结构几乎和JSP文件相同，只是扩展名不同而已。

也就是说，一个Tag文件中可以有普通的HTML标记符、某些特殊的指令标记、成员变量和方法、Java程序片和Java表达式等。

在记事本中编写如下一个Tag文件

Trangle.tag：

这是一个Tag文件，负责计算三角形的面积:

<%@attributename="sideA"required="true"%>

<%@attributename="sideB"required="true"%>

<%@attributename="sideC"required="true"%>

<%!

publicStringgetArea（doublea,doubleb,doublec）

{if（a+b>c&&a+c>b&&c+b>a）

{doublep=（a+b+c）/2.0;

doublearea=Math.sqrt（p*（p-a）*（p-b）*（p-c））;

return"
三角形的面积:

"+area;

}

else

{return（"
"+a+","+b+","+c+"不能构成一个三角形,无法计算面积"）;

}

}

%>

<%out.println（"
jsp页面传递过来的三边：

"+sideA+","+sideB+","+sideC）;

doublea=Double.parseDouble（sideA）;

doubleb=Double.parseDouble（sideB）;

doublec=Double.parseDouble（sideC）;

out.println（getArea（a,b,c））;

%>

（2）将Trangle.tag保存在..\ROOT\WEB-INF目录下

（3）在ROOT目录下编写exer5_1.jsp文件，代码如下：

<%@pagecontentType="text/html;Charset=GB2312"%>

<%@taglibtagdir="/WEB-INF/tags"prefix="computer"%>

请选择三角形的三条边

SIDEA:

3

4

5

S