web实验报告

本科实验报告

课程名称： web程序设计基础A

实验项目：一、HTML语言二、网页程序设计-JavaScript

三、Request与Response对象的应用

四、Application对象Session对象

实验地点：逸夫楼502

专业班级：软件1219 学号：

学生姓名：

指导教师：

20##年 11月 20 日

实验一 HTML语言

一、实验目的

1．掌握常用的HTML语言标记；

2．利用文本编辑器建立HTML文档，制作简单网页。

二、实验要求

1．独立完成实验。

2．书写实验报告书。

三、实验内容

1．在文本编辑器“记事本”中输入如下的HTML代码程序，以文件名sy1.html保存，并在浏览器中运行。（请仔细阅读下列程序语句，理解每条语句的作用）

源程序清单如下：

<html>

<head>

<title>Example</title>

</head>

<MARQUEE BGCOLOR= "#FFFF00" direction=left behavior=alternate>welcome to you</MARQUEE>

</FONT></I></B></h1>

<hr>

<h2 align=center><FONT COLOR="#0000FF">A simple HTML document</FONT></h2>

<EM>Welcome to the world of HTML</EM>

<p>This is a simple HTML document.It is to give you an outline of how to write HTML file and how the<b> markup tags</b> work in the <I>HTML</I> file</p>

<p>Following is three chapters

<ul>

<li>This is the chapter one</li>

<li><A HREF="#item">This is the chapter two</A></li>

<li>This is the chapter three</li>

</ul></p>

<hr>

<p><A NAME="item">Following is items of the chapter two</A> </p>

<tr>

<th>content</th>

</tr>

<tr>

</tr>

<tr>

<td>table</td>

</tr>

<tr>

</tr>

</table>

<hr><p>

1<p>

2<p>

3<p>

4<p>

5<p>

6<p>

7<p>

<B><I><FONT COLOR=BLUE SIZE=4>End of the example document </FONT></I></B>

</p>

</body>

</html>

实验结果：

2．代码：

实验结果：

实验二 网页程序设计-JavaScript

一、实验目的

1．掌握JavaScript技术,基本掌握JavaScript的开发技巧；

2．利用文本编辑器建立JavaScript脚本语言进行简单编程。

二、实验要求:

1．根据以下实验内容书写实验准备报告。

2．独立完成实验。

三、实验内容

1．显示一个动态的时钟

在文本编辑器“记事本”中输入如下代码程序，请仔细阅读下列程序语句，理解每条语句的作用。源程序清单如下：

运行结果：

2．事件驱动和事件处理

在文本编辑器“记事本”中输入如下代码程序，请仔细阅读下列程序语句，理解每条语句的作用。源程序清单如下：

运行结果：

点击后：

3．JavaScript表单校验

编写程序register.htm，做一个如下图所示的用户注册界面，要求对用户填写的部分进行合法性检验。

代码：

运行结果：

实验3 Request与Response对象的应用

一、实验目的

1．掌握JSP的Request与Response隐式对象的用法，基本掌握JSP的开发技巧。

2．在JDK和Eclipse环境下，完成下列实验。

二、实验要求

1．独立完成实验。

2．书写实验报告书。

三、实验内容

编写程序实现一个单选小测试。在test.jsp页面显示问题，并将答案提交至answer.jsp进行判断，如果回答正确，则将页面转至yes.jsp;否则，转至no.jsp。

代码：

Test.jsp

<%@ page language="java" import="java.util.*" pageEncoding="GB2312"%>

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title> jsp测试 </title>

</head>

<body>

北京奥运会的开幕时间是：<br>

<table>

<tr>

<td>

<input type="radio" name="date" value="86">8月6日

</td>

<td>

<input type="radio" name="date" value="88" >8月8日

</td>

<td>

<input type="radio" name="date" value="89" >8月9日

</td>

<td>

<input type="radio" name="date" value="90" >8月10日

</td>

</tr>

</table>

</form>

</body>

</html>

Answer.jsp

<%@ page language="java" import="java.util.*" pageEncoding="GB2312"%>

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>answer.jsp</title>

</head>

<body>

<%String str=null;

str=request.getParameter("date");

if(str.equals("88"))

response.sendRedirect("yes.jsp");

else

response.sendRedirect("no.jsp");

</body>

</html>

Yes.jsp

<%@ page language="java" import="java.util.*" pageEncoding="GB2312"%>

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

</head>

恭喜你答对了！

</div></body>

</html>

No.jsp

<%@ page language="java" import="java.util.*" pageEncoding="GB2312"%>

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

</head>

你选错了！

</div></body>

</html>

运行结果：

实验4 Application对象Session对象

一、实验目的

1．掌握JSP的Application对象Session对象对象的用法，基本掌握JSP的开发技巧。

2．在JDK和Eclipse环境下，完成下列实验。

二、实验要求:

1．独立完成实验

2．书写实验报告书

三、实验内容:

1．请仔细阅读下列程序语句，理解每条语句的作用。源程序清单如下：

运行结果：

2．上述计数器当进行刷新时也会自动加1，试编写程序count.jsp，实现防刷新文本计数器。

代码：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<html>

<head>

<title>防刷新文本计数器</title>

</head>

<body>

<% if(!session.isNew())

{ out.print("你是第"+application.getAttribute("counter")+"位访问者"); }

else

{

if(application.getAttribute("counter")==null)

application.setAttribute("counter","1");

else

{

String strnum=null;

strnum=application.getAttribute("counter").toString();

int icount=0;

icount=Integer.valueOf(strnum).intValue();

icount++;

application.setAttribute("counter",Integer.toString(icount)); }

out.print("你是第"+application.getAttribute("counter")+"位访问者"); } %>

</body>

</html>

运行结果：

3．编写程序register.htm和register.jsp，做一个用户注册的界面，要求对用户填写的部分进行合法性检验，然后提交到register.jsp进行注册检验，若用户名为user开头的，就提示“该用户名已被注册”，若用户名为admin，就提示“欢迎您，管理员”，否则，就显示“注册成功”。

Register.html

<html>

<head>

function checkpassword()

{

if(document.form1.password.value != document.form1.password2.value)

{

alert("两次密码输入不一致");

return;

}

function checkname()

{

if(document.form1.name.value !="")

{return;}

else {alert("用户名为空！"); return;}

}

</script>

</head>

<body>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

<td><input type = "radio" name = "gender" value = "female" >女性

</tr>

<tr>

</tr>

<tr>

<td><textarea name = "brief" rows =5 cols = 30>请输入留言</textarea></td>

</tr>

<tr>

</tr>

</table>

</div></form>

</body>

</html>

Register.jsp

<%@ page contentType="text/html; charset=gb2312" language="java" import="java.sql.*" errorPage="" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>register.jsp</title>

</head>

<body>

String myusername = request.getParameter("name");

if(myusername.length()>=4)

{String mystring = myusername.substring(0,4);

if(mystring.equalsIgnoreCase("user") )

out.println("对不起，该用户名已经被注册！请重新输入！");

elseif(myusername.equalsIgnoreCase("admin"))

out.println("欢迎您，管理员！");

else

out.println("恭喜您，注册成功！"); }

else

{ out.println("恭喜您，注册成功！"); } %>

</body>

</html>

运行结果：

1、

2、

3、

4、

相关推荐

web实验报告

专栏推荐