太原理工,web实验报告_第1页
太原理工,web实验报告_第2页
太原理工,web实验报告_第3页
太原理工,web实验报告_第4页
太原理工,web实验报告_第5页
已阅读5页，还剩21页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

1、 实 验 报 告学院：软件学院系：软件工程专业：软件工程班级：软件1111班学号：20110000姓名：史珍香指导教师：田玉玲时间：2013年12月24日学院名称软件学院专业班级1111学号20110000实验成绩学生姓名史珍香同组人姓名实验日期12.13课程名称Web程序设计基础实验题目HTML语言一、 实验目的1. 掌握常用的HTML语言标记。2. 利用文本编辑器建立HTML文档，制作简单网页。二、 实验要求1 独立完成实验。2 书写实验报告书。三、 实验内容1. 在文本编辑器“记事本”中输入如下的HTML代码程序，以文件名sy1.html保存，并在浏览器中运行。（请仔细阅读下列程序语句，

2、理解每条语句的作用）源程序清单如下：<html> <head> <title>Example</title> </head> <body bgcolor="#00DDFF"> <h1><B><I><FONT COLOR="#FF00FF"><MARQUEE BGCOLOR="#FFFF00" direction=left behavior=alternate>welcome to you</MARQ

3、UEE> </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

4、 write HTML file and how the <b>markup tags</b>work in the<I>HTML</I>file</p> <p>Following is a three chapters <ul> <li>This is the chapter one</li> <li><A HREF="#item">This is the chapter two</A></li> <li>

5、This is the chapter three</li> </ul> <hr> <p><A NAME="item">Following is items of the chapter two</A></p> <table border=2 bgcolor=gray width="40%"> <tr> <th>item</th> <th>content</th> </tr> <tr

6、> <td>item 1</td> <td>font</td> </tr> <tr> <td>item 2</td> <td>table</td> </tr> <tr> <td>item 3</td> <td>form</td> </tr> </table> <hr><p> 1<p> 2<p> 3<p> 4<p

7、> 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. 编写一个能输出如图所示界面的HTML文件。四、 实验结果1. 2. 程序清单：<html> <head> <title>表单范例</title> </head>

8、<body> <table align="center"><caption><h2><b>请留下个人资料</b><hr size="1" width="170" color="black"></h2></p></caption> <form name="form"> <tr><td align="right">姓名：<

9、;/td> <td><input type="text" name="姓名"></td></tr> <tr><td align="right">E-mail：</td><td><input type="text" name="邮箱"></td></tr> <tr><td align="right">电话：</t

10、d><td><input type="text" name="电话"></td></tr> <tr><td align="right">性别：</td><td><input type="radio" name="性别" checked>女 <input type="radio" name="性别">男</td></

11、tr> <tr><td align="right">年龄：</td><td><select> <option selected>20以下 <option>40以下 <option>60以下 <option>60以上 </select></td></tr> <tr><td align="right">留言板：</td> <td><textarea name

12、="留言板" rows="5" cols="40"></textarea><br></td></tr> <tr><td align="right">您的爱好：</td> <td><input type="checkbox" name="运动">运动<br> <input type="checkbox" name="阅

13、读">阅读<br> <input type="checkbox" name="听音乐">听音乐<br> <input type="checkbox" name="旅游">旅游 </td></tr> <tr><td align="center" colspan="2"><input type="submit" name="提交&qu

14、ot; value="提交" &nbsp&nbsp&nbsp&nbsp&nbsp<input type="reset" name="重写" value="全部重写"></td></tr> </form> </table> </body></html>五、 讨论、心得通过此次实验，让我收获许多，主要收获如下：1.能熟练地掌握基本的HTML语言标记，懂得每一个标记所代表的意思。2.进一步熟悉了表单

15、的制作过程以及表单中各标记的灵活应用。学院名称软件学院专业班级1111学号20110000实验成绩学生姓名史珍香同组人姓名实验日期12.13课程名称Web程序设计基础实验题目网页程序设计JavaScript一、实验目的3. 掌握JavaScript技术，基本掌握JavaScript的开发技巧。4. 利用文本编辑器建立JavaScript脚本语言进行简单编程。二、实验要求3 根据以下实验内容书写实验准备报告。4 独立完成实验。三、实验内容 1、显示一个动态的时钟在文本编辑器“记事本”中输入如下代码程序，请仔细阅读下列语句，理解每条语句的作用。源程序清单如下：<html> <he

16、ad> <script language="javascript"> var timer = null; function stop() clearTimeout(timer); function start() var time = new Date(); var hours = time.getHours(); var minutes = time.getMinutes(); minutes = (minutes < 10)?"0":"") + minutes; var seconds = time.get

17、Seconds(); seconds = (seconds < 10)?"0":"") + seconds; var clock = hours+":"+minutes+":"+seconds; document.forms0.display.value = clock; timer = setTimeout("start()",1000); </script> </head> <body onload = "start()" onunlo

18、ad = "stop()"> <form>现在是北京时间：<input type = "text" name = "display" size = "20"> </from> </body></html>分析上述代码的作用，然后用浏览器运行文件，验证自己的判断是否正确。2、事件驱动和事件处理在文本编辑器“记事本”中输入如下代码程序，请仔细阅读下列语句，理解每条语句的作用。源程序清单如下：<html> <head> <sc

19、ript language="javascript"> function myfunction() alert("HELLO"); </script> </head> <form> <body> <input type="button" onclick="myfunction()" value="Call function"> </form> <p>By pressing the button,a funt

20、ion will be called.The function will alert a message.</p> </body></html>分析上述代码的作用，然后用浏览器运行文件，验证自己的判断是否正确。3. JavaScript表单校验编写程序register.htm，做一个如下图所示的用户注册界面，要求对用户填写的部分进行合法性验证。四、实验结果1、 2、3. 程序清单：<html> <head> <title>用户登录</title> <script> function myfuncti

21、on() if(form.username.value="") alert("用户名不能为空，请输入用户名！");form.username.focus();return false; if(form.password.value="") alert("密码不能为空，请输入密码");form.password.focus();return false; </script> </head> <body> 用户登录<br> <form name="form

22、" onsubmit="return myfunction()" method="post" action="sy2-3(2).html"> 请输入用户名：<input type="text" name="username"><br> 请输入密码：<input type="password" name="password"><br> <input type="submit&qu

23、ot; name="button" value="提交"> <input type="reset" value="全部重写"> </form> </body></html>五、讨论、心得通过此次实验，让我收获许多，主要收获如下：1.学会使用JavaScript脚本语言进行简单的编程。2.基本掌握了JavaScript的开发技巧，理解了事件驱动与事件处理还有事件之间的区别。学院名称软件学院专业班级1111学号20110000实验成绩学生姓名史珍香同组人姓名实验日期

24、12.13课程名称Web程序设计基础实验题目Request与Response对象的应用一. 实验目的1掌握JSP的Request与Response隐式对象的用法，基本掌握JSP的开发技巧。2在JDK和Eclipse环境下，完成下列实验。二实验内容编写程序实现一个单选小测试。在test.jsp页面显示问题，并将答案提交至answer.jsp进行判断，如果回答正确，则将页面转至yes.jsp;否则，转至no.jsp。 三实验过程中遇到的问题及解决方法软件在配置过程中遇到一些问题，和tomcat连接时由于使用的全部为英文软件，操作有些困难。在进行编写程序的时候不会页面跳转，后使用response.s

25、endRedirect（）命令来进行页面的跳转，并且产生不同的结果。四实验结论和感想在不断地摸索中掌握JSP的Request与Response隐式对象的用法，以及在jsp环境下如何配置，编译，编程是一个锻炼人耐心的工作，遇到的重重问题只有在不断尝试和克服下，才能获取成功。五实验程序Test.jsp<% page language="java" import="java.util.*" pageEncoding="utf-8"%><html> <body > <h2>北京奥运会开幕日期是：

26、 <br><br> <form action="ansewr.jsp" method=post name=form1> <input type=radio name="date" checked value="6"> 8月6日 <input type=radio name="date" value="8"> 8月8日 <input type=radio name="date" value="9&quo

27、t;> 8月9日 <input type=radio name="date" value="10"> 8月10日 <p></p> </h2> <input type=submit value=提交答案> </form> </body></html>answer.jsp<% page language="java" import="java.util.*" pageEncoding="utf-8&qu

28、ot;%><html> <body> <% String mydate; mydate=request.getParameter("date"); if(mydate.equals("8") response.sendRedirect("yes.jsp"); else response.sendRedirect("no.jsp"); %> </body></html>yes.jsp<% page language="java"

29、; import="java.util.*" pageEncoding="utf-8"%><html> <body background="D:MyEclipseXXSSSWebRoot1.jpg"> <br><br><br> <h1>恭喜您答对了！</h1> </body></html>no.jsp<% page language="java" import="java.util.*&

30、quot; pageEncoding="utf-8"%><html> <body> <br><br><br> <h1>很抱歉，您答错了！</h1> </body></html>学院名称软件学院专业班级1111学号20110000实验成绩学生姓名史珍香同组人姓名实验日期12.13课程名称Web程序设计基础实验题目Application对象Session对象一、实验目的5. 掌握JSP的Application对象Session对象的用法，基本掌握JSP的开发技巧。6

31、. 在JDK和Eclipse环境下，完成下列实验。二、实验要求5 独立完成实验。6 书写实验报告书。三、实验内容1. 请仔细阅读下列程序语句，理解每条语句的作用。源程序清单如下：<%page contentType="text/html;charset=gb2312"%><html> <head><title>网页计数器</title></head> <body> <% if(application.getAttribute("counter")=null) app

32、lication.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); %> 您是第<%=

33、application.getAttribute("counter")%>位访客！ </body></html>2. 上述计数器当进行刷新时也会自动加1，是编写程序count.jsp，实现防刷新文本计数器。3. 编写程序register.htm和register.jsp，做一个用户注册的界面，要求对用户填写的部分进行合法性检验，然后提交到register.jsp进行注册检验，若用户名为user开头的，就提示“该用户名已被注册”，若用户名为admin，就提示“欢迎您，管理员”，否则，就显示“注册成功”。四、实验结果4. 1中的计数器不能防止刷新，

34、当进行刷新时也会自动加1。 5. 源程序清单： <%page contentType="text/html;charset=gb2312"%><html> <head><title>网页计数器</title></head> <body> <% if(application.getAttribute("counter")=null) application.setAttribute("counter","1"); else St

35、ring strnum=null; strnum=application.getAttribute("counter").toString(); int icount=0; icount=Integer.valueOf(strnum).intValue(); if(session.isNew() icount+; application.setAttribute("counter",Integer.toString(icount); %> 您是第<%=application.getAttribute("counter")%

36、>位访客！ </body></html>程序清单：Register.htm:<html> <head><title>用户注册</title></head> <body> <p><h2 align="center">用户注册</h2></p> <form action="register.jsp" method="post" > <table> <tr>

37、<td>用户名：</td><td><input type="text" name="user" id="user"/></td></tr> <tr><td> 密&nbsp&nbsp&nbsp码：</td><td><input type="password" name="password" id="password"/>&l

38、t;/td></tr> <tr><td align="center"><input type="submit" value="注册"/></td> <td algin="center"><input type="reset" value="重置"/> </td></tr> </form> </body></html>Regist

39、er.jsp:<% page language="java" import="java.util.*" pageEncoding="gb2312"%><%String path = request.getContextPath();String basePath = request.getScheme()+":/"+request.getServerName()+":"+request.getServerPort()+path+"/"%><!DO

40、CTYPE HTML PUBLIC "-/W3C/DTD HTML 4.01 Transitional/EN"><html> <head> <base href="<%=basePath%>"> <title>My JSP 'register.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"><meta http

41、-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="This is my page"

42、;><!-<link rel="stylesheet" type="text/css" href="styles.css">-> </head> <body> <%String a; a=request.getParameter("user"); if(a.indexOf("user")=0) out.println("该用户名已被注册!"); else if(a.toString().matches("a

43、dmin") out.println("欢迎您，管理员!"); else out.println("注册成功"); %> </body></html>使用用户名为user1的用户注册：注册之后的结果：使用用户名为admin的用户注册：注册之后的结果：使用其他用户名注册：注册之后的结果：五、讨论、心得通过此次实验，让我收获许多，主要收获如下：1.学会使用JSP中的Application对象和Session对象。2.Application对象和Session对象各有优劣，前者能记录访问服务器的所有用户，而后者建立一个用

44、户与服务器的一系列会话。学院名称软件学院专业班级1111学号20110000实验成绩学生姓名史珍香同组人姓名实验日期12.13课程名称Web程序设计基础实验题目使用JDBC连接数据库一、实验目的7. 掌握JSP与数据库的连接技术-JDBC。8. 掌握JSP数据库编程技术。二、实验要求7 独立完成实验。8 书写实验报告书。三、实验内容利用数据库建立一个同学录，然后通过JDBC编写一系列基于Web方式的JSP程序，来对同学录的数据库进行添加，查询等功能，要求在页面上显示出来。四、实验步骤1. 建立数据库建立名为students的access数据库，在库中建立schoolmate表，字段包括：id自

45、动编号Name文本Birthday日期Phone文本Email文本Address文本Other文本2. 创建数据源名打开数据源（ODBC）；添加microsoftsoft Access Drever（*.Mdb）数据源驱动程序，数据源名称：students；更改默认数据库，选择students。3. 运行所编写的应用程序启动eclipse，建立项目exp5，将编写的程序放入该项目的WebContent下，右键点击WebContent，选择”刷新”。打开要运行的页面，在程序的任意位置单击右键，选择”运行方式”/ “在服务器上运行”，单击”在服务器上运行“对话框的完成即可看到运行结果五、实验结果

46、源程序清单： student.jsp:<% page language="java" import="java.util.*" pageEncoding="gb2312"%><% page contentType="text/html;charset=gb2312" %><%page import="java.sql.*"%><% page import="java.text.SimpleDateFormat" %><!D

47、OCTYPE HTML PUBLIC "-/W3C/DTD HTML 4.01 Transitional/EN"><html> <head> <title>My JSP 'txl.jsp' starting page</title> <script language="javascript">function on_submit()alert("确定删除？"); </script> </head> <body> <

48、;% String driverName="sun.jdbc.odbc.JdbcOdbcDriver" Class.forName(driverName);/加载驱动 Connection con=DriverManager.getConnection("jdbc:odbc:students");/数据库连接 Statement s=con.createStatement();/定义查询数据库对象 ResultSet rs=s.executeQuery("select * from schoolmate1;"); %> <

49、p align="center"> <table border="1" > <caption><h2><font face="迷你简少儿">通讯录</font></h2></caption> <tr> <font face="迷你简少儿"><th>id</th><th>name</th><th>birthday</th><th

50、>phone</th><th>email</th><th>address</th><th>other</th> </font></tr> <% while(rs.next() out.println("<tr>"); out.println("<td>"+rs.getInt("id")+"</td>"); out.println("<td>

51、"+rs.getString("name")+"</td>"); out.println("<td>"+rs.getDate("birthday")+"</td>"); out.println("<td>"+rs.getString("phone")+"</td>"); out.println("<td>"+rs.getString(&

52、quot;email")+"</td>"); out.println("<td>"+rs.getString("address")+"</td>"); out.println("<td>"+rs.getString("other")+"</td>"); out.println("</tr>"); rs.close(); %> </table&g

53、t; </p> <hr/> <p align="center"> <table border="1"> <caption><font face="迷你简少儿">插入同学信息</font></caption> <tr> <th>name</th><th>birthday</th><th>phone</th><th>email</th>&

54、lt;th>address</th><th>other</th> </tr> <tr><form action="insert2.jsp" method="post" name="form1"> <th valign="top"><input type="text" name="1"/></th> <th valign="top">

55、<input type="text" name="2"/></th> <th valign="top"><input type="text" name="3"/></th> <th valign="top"><input type="text" name="4"/></th> <th valign="top">

56、<input type="text" name="5"/></th> <th valign="top"><input type="text" name="6"/></tr> <tr><th colspan="7" align="center"><input type="submit" value="插入"/> <in

57、put type="reset" value="重置"/></th> </form></tr> </table> </P> <hr/> <p align="center"> <form action="delete.jsp" method="post" onsubmit="return on_submit()"> <table border="1"&

58、gt; <caption><font face="迷你简少儿">请输入要删除同学的姓名</font></caption> <tr><td><font face="迷你简少儿">name</font></td><td><input type="text" name="name"/></td><td><input type="submit"

59、 value="删除"/></td></tr> </table> </form> </p> </body></html>insert.jsp:<% page language="java" import="java.util.*" pageEncoding="gb2312"%><%page contentType="text/html;charset=gb2312" %><%p

60、age import="java.sql.*"%><% page import="java.text.SimpleDateFormat" %><!DOCTYPE HTML PUBLIC "-/W3C/DTD HTML 4.01 Transitional/EN"><html> <head> <title>My JSP 'txl.jsp' starting page</title> <meta http-equiv="pragma

61、" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="

62、description" content="This is my page"> </head> <body> <%SimpleDateFormat formatt= new SimpleDateFormat("yyyy-MM-dd") ; String name=request.getParameter("1"); byte b=name.getBytes("ISO-8859-1"); name=new String(b); String bir=request.get

63、Parameter("2"); String pho=request.getParameter("3"); String ema=request.getParameter("4"); String add=request.getParameter("5"); byte c=add.getBytes("ISO-8859-1"); add=new String(c); String oth=request.getParameter("6"); byte d=oth.getByte

64、s("ISO-8859-1"); oth=new String(d); String driverName="sun.jdbc.odbc.JdbcOdbcDriver" Class.forName(driverName);/加载驱动 Connection con=DriverManager.getConnection("jdbc:odbc:students");/数据库连接 Statement rs=con.createStatement(); PreparedStatement ps=con.prepareStatement("insert into schoolmate1(name,birthday,phone,email,address,other) values(?,?,?,?,?,?)"); ps.setString(1,name); ps.setDate(2,new java.sql.Date(formatt.parse(bir).getTime(); ps.setString(3,pho); ps.setS

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论