web网页设计与制作实习报告

网页设计与制作

实验报告

2015.5.23

实验一简单网页制作

一、实验目的

1．熟悉Dreamweaver软件的操作界面。

2．掌握建立本地站点的方法。

3．掌握简单网页制作方法。

4．掌握超链接的建立方法。

三、操作步骤

1．创建“潜水俱乐部”站点

（1）在D盘新建文件夹，命名为shiyan1；

（2）将images文件夹和gallery文件夹复制到中shiyan1中；

（3）启动Dreamweaver，使用“站点｜新建站点”命令创建站点。

2．制作“俱乐部首页”。

（1）新建网页。

（2）使用“文件｜保存”命令保存网页，命名为index.html。

（3）在文档工具栏上设置网页标题“泡泡潜水俱乐部欢迎你”。

（4）从“文本.txt”中将首页的相关文字粘贴到网页中。

（5）设置一级标题、二级标题、三级标题、项目列表、编号列表。

（6）插入图像。

（7）在Copyright后插入版权符号©。

（8）在电话号码之间插入半角空格。

（9）在电子邮箱地址上建立超链接，mailto: vip@BubbleUnder.com。

（10）选中网页内容，然后单击“插入Div标签”按钮，分别插入header、navigation、mainContent、footer共4个Div。

（11）保存网页，按F12，预览网页。

四.实验结果

实验二 XHTML语言

一、实验目的

1．掌握XHTML 语法。

2．掌握XHTML标记及属性。

3．掌握XHTML 标记校验的方法。

二、实验内容

制作“学校主页-新闻中心-学校新闻-校领导赴包装设计艺术学院调研”的网页

校领导赴包装设计艺术学院调研

浏览：2827次日期：20##-03-21

三、操作步骤

1）创建站点

（1）在D盘新建文件夹，命名为shiyan2；

（2）将“文本.txt”和images文件夹复制到中shiyan2中；

2）用记事本打开“文本.txt”。

3）选择“文件 | 另存为”命令，将文件另存为shiyan2.html。

4）在网页中添加XHTML标记和属性。实验标题字体黑体蓝色40px

日期字体宋体灰色大小12px 正文字体楷体大小14px

5）用浏览器打开，并修改发现的错误。

四、实验制作结果

实验三导航栏制作

一、实验目的

1．掌握垂直导航条的制作方法。

2．掌握水平导航条的制作方法。

二、实验内容

制作学校样式的导航条。

三、操作步骤

<title>导航栏制作</title>

<style type="text/css">

body,div,ul,li,h1,h2,h3,h4,h5,h6{

margin:0px;

padding:0px;

}

#nav{

width:800px;

height:51px;

margin:100px auto;

background:url(nav_bg.jpg) repeat-x;

}

#nav ul{

list-style-type:none;

}

#nav ul li{

float:left;

width:100px;

height:51px;

background:url(nav_01.jpg) no-repeat right center;

}

#nav ul li a{

display:block;

width:100px;

height:51px;

line-height:51px;

text-align:center;

color:#ffffff;

text-decoration:none;

}

#nav ul li a:hover{

width:100px;

height:51px;

background:url(nav_03.jpg) no-repeat;

}

</style>

</head>

<body>

<div id="nav">

<ul>

<li><a href="#">学校概况</a></li>

<li><a href="#">学科建设</a></li>

<li><a href="#">科学研究</a></li>

<li><a href="#">师资队伍</a></li>

<li><a href="#">教学管理</a></li>

<li><a href="#">招生就业</a></li>

<li><a href="#">对外交流</a></li>

<li><a href="#">学校首页</a></li>

</ul>

</div>

</body>

</html>

四、实验制作结果图

实验四 应用背景图像

一、实验目的

1．掌握CSS背景（background）属性。

2．掌握设置背景图像位置的方法。

3．掌握使用背景图像替换文本的方法。

4．掌握使用背景图像制作圆角框的方法。

二、实验内容

1．制作圆角框。

2．制作泡泡俱乐部首页。

三、实验步骤

1．制作圆角框。

（1）创建站点。

（2）创建内部样式表。

在浏览器中的效果如下：

制作圆角框

四、实验结果

实验五浮动(float)页面布局

一、实验目的

1．掌握固定宽度网页布局的方法。

2．深入理解浮动的概念。

3．掌握三列布局网页的典型逻辑结构。

4．熟练掌握CSS浮动布局的方法。

二、实验内容

制作一个简易的博客首页。

三、实验步骤

1. 整体布局与公共CSS定义

分析页面主要分5大块，顶部的Logo、导航条Nav、Banner、Content、Footer，

2.布局Logo栏

首先我们需要把页面上的logo给切割出来，其大小为173*46,名字为：logo.gif

一般网站都会做到点击logo，就会回到主页，应该怎么做呢，大家首先会想到，给图片加上链接就可以了，代码一般会这么写
<a href="#" id="logoLink"><img src="#" /></a>
不过KwooJan要介绍另外一种方法，将图片做成链接a的背景，同样可以达到上面说的效果，并且HTML代码就会更精简，少了<img...>，看看下面Logo栏的页面代码，红色的为将logo.gif作为背景的链接

3.布局导航栏Nav

4.Banner布局

第一种：将图片作为<div id="Banner"></div>背景

第二种：直接将图片插入<div id="Banner"></div>之间，代码：<div id="Banner"><img src="" /></div>

5.内容Content板块布局

从图片上我们看到，内容板块分为左右两个区域，左边ContentL宽度是600px，右边ContentR宽度是300px，但是由于我们要将内边距设置成15px(这样才会好看)，所以ContentL的宽度在CSS中就要设置成600-15*2=570px,而右侧的ContentR则需要设置成300-15*2=270px；

6.Footer布局内容左侧板块(ContentL)布局

7.内容右侧板块(ContentR)布局

四、实验总结

在浏览器中的效果如下：

第二篇：web实习报告

信息网络系统开发课程实习

20##-2013第1学期

题目：潮流鞋城

院（系、部）：工商管理学院信息管理教学部

学生姓名：王海超

指导教师：刘淑霞

20##年12月2 8日

摘要..................................................................... 3

Abstract................................................................. 3

1 鞋城的登录、注册与注销................................................. 4

1.1 登录............................................................................................................................ 4

1.2 注册............................................................................................................................ 7

1.3 注销.......................................................................................................................... 10

2链接页面............................................................... 12

2.1 店铺交流区.............................................................................................................. 12

2.2购物区....................................................................................................................... 12

2.3 淘宝网...................................................................................................................... 14

2.4凡客........................................................................................................................... 14

3店铺交流区-留言板...................................................... 15

4 购物区-购物车.......................................................... 23

结论..................................................................... 39

致谢..................................................................... 40

参考文献................................................................. 41

摘要：

随着科学技术的发展和进步人们的生活水平也在不断的提高。人们都说这是一个网络的时代，因此Internet的使用变得越来越广泛和普及。本学期学习JAVA以及JAVAWEB让我对系统开发这个方向有了自己理解和认识。潮流鞋城网站主要运用到了JSP、HTML等。开发工具运用的是Dreamweaver和MyEclipse。大家可以在店铺交流区给店主留言，方便交流。可以在购物区自由选择所需物品，也可链接到淘宝、凡客等大型购物网站。

Abstract：

With the development of science and technology and progress  people's standard of living is also in constant increase. People say it is a network of times, so the use of the Internet is becoming more and more widely and popularization. The term learning JAVA and JAVAWEB let me on the system development in this direction have their understanding and knowledge. Tide shoes city website mainly USES the JSP, HTML, etc. Development tool is the use of Dreamweaver and MyEclipse. You can shop in communication area to the shopkeeper message, convenient communication. In the shopping area can be free to select the desired goods, also can link to clean out treasure, every guest and other large shopping website.

1.鞋城的登录、注册与注销

1.1登录

在各系统中几乎都会包括用户登录验证及注销的功能，此功能完全可以使用session实现。具体思路是：当用户登陆成功后，设置一个session范围的属性，然后在其他需要验证的页面中判断是否存在此session范围的属性，如果存在，则表示已经是正常登录，用户登录后可以进行注销的操作。

denglu.jsp：完成登录表单的显示，同时向叶面提交数据，已完成登录的验证。如果登录成功（用户名和密码固定：whc/123456），则保存属性；如果登录失败，则显示登录失败的信息。

<%@ page language="java" contentType="text/html" pageEncoding="utf-8"%>

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>My JSP 'denglu.jsp' starting page</title>

<!--

-->

</head>

欢迎进入潮流鞋城！</font></strong></font>

<marquee

style="font-family: 华文行楷; color: #FF00FF; text-decoration: blink; font-size: lem; font-style: oblique">欢迎光临！</marquee>

还没有注册？点击</font>

</body><h2>

用户名： <input type="text" name="uname"><br> 密 码 : </font>     <input

type="text" name="upass"><br> <input type="submit"

value="登录"> <input type="reset" value="重置">

</form>

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

String password=request.getParameter("upass");

if(!(name==null||"".equals(name)

||password==null||"".equals(password))){

if("whc".equals(name)&&"123456".equals(password)){

response.setHeader("refresh", "2;URL=1.jsp");

session.setAttribute("userid", name);

<h3>用户登录成功，两秒后跳转到欢迎页！</h3>

<h3>

如果没有跳转，请按<a href="1.jsp">这里</a>

</h3>

}else{

<h3>错误的用户名和密码！</h3>

}

</body>

</html>

1.2 注册

zhuce.jsp：

代码:

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

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>My JSP 'zhuce.jsp' starting page</title>

<!--

-->

</head>

<tbody>

<tr>

</td>

</tr>

<tr>

</td>

</tr>

<tr>

</td>

</tr>

<tr>

<td> <input type="radio" name="sex" value="男">男 <input

type="radio" name="sex" value="女">女</td>

</tr>

<tr>

</tr>

<tr>

</tr>

</tbody>

</table>

</body>

</html>

1.3 注销

zhuxiao.jsp：此功能完成登录的注销，注销后，页面要跳转回denglu.jsp页面，等待用户继续登录。

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

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>My JSP 'zhuxiao.jsp' starting page</title>

<!--

--> </head>

<h2>您已成功退出鞋城，期待您的下次光临！！！</h2>

</body>

</html>

2.链接页面

2.1 店铺交流区

2.2 购物区

2.3 淘宝网

2.4凡客

代码：<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

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>My JSP '1.jsp' starting page</title>

<!--

--> </head>

<body>  <br><body background="picture/b.jpg"><div align="center"> <font size="6" face="隶书">友情链接<br><br><font size="7"><a href="jiaoliu.jsp">店铺交流区</a>

</font></font><font size="7"><br></font><font size="7" face="隶书">   </font><font size="7" face="隶书"><br><a href="welcome.jsp">购物区</a></font></div>

</body>

</html>

淘宝网：

凡客：

3.店铺交流区-留言板

1.创建工具JavaBean——MyTools。

package com.yxq.toolbean;

import java.io.UnsupportedEncodingException;

import java.text.SimpleDateFormat;

import java.util.Date;

public class MyTools {

public static String changeTime(Date date){

SimpleDateFormat format=new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");

return format.format(date);

}

public static int strToint(String str){ //将String型数据转换为int型数据的方法

if(str==null||str.equals(""))

str="0";

int i=0;

try{

i=Integer.parseInt(str);

}catch(NumberFormatException e){

i=0;

e.printStackTrace();

}

return i;

}

public static String toChinese(String str){ //进行转码操作的方法

if(str==null)

str="";

try {

str=new String(str.getBytes("iso-8859-1"),"utf-8");

} catch (UnsupportedEncodingException e) {

str="";

e.printStackTrace();

}

return str;

}

2.创建值JavaBean——WordSingle。

package com.yxq.valuebean;

public class WordSingle {

private String author;

private String title;

private String content;

private String time;

public String getAuthor() {

return author;

}

public void setAuthor(String author) {

this.author = author;

}

public String getContent() {

return content;

}

public void setContent(String content) {

this.content = content;

}

public String getTime() {

return time;

}

public void setTime(String time) {

this.time = time;

}

public String getTitle() {

return title;

}

public void setTitle(String title) {

this.title = title;

}

3.创建用户填写留言信息的页面

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

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>My JSP 'liuyan.jsp' starting page</title>

<!--

-->

</head>

<body >

留言者： 

留言标题：

留言内容：

<p>

</p>

</form>

</body>

4.创建处理用户请求的Servlet——WordServlet。

package com.yxq.valuebean;

public class WordSingle {

private String author;

private String title;

private String content;

private String time;

public String getAuthor() {

return author;

}

public void setAuthor(String author) {

this.author = author;

}

public String getContent() {

return content;

}

public void setContent(String content) {

this.content = content;

}

public String getTime() {

return time;

}

public void setTime(String time) {

this.time = time;

}

public String getTitle() {

return title;

}

public void setTitle(String title) {

this.title = title;

}

5.创建显示留言信息的show1.jsp页面。

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

<%@ page import="java.util.ArrayList"%>

<%@ page import="com.yxq.valuebean.WordSingle" %>

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>My JSP 'show.jsp' starting page</title>

<!--

-->

</head>

<body>

<%ArrayList wordlist=(ArrayList)application.getAttribute("wordlist");

if(wordlist==null||wordlist.size()==0)

out.print("没有留言可以显示！");

else{

for(int i=wordlist.size()-1;i>=0;i--){

WordSingle single=(WordSingle)wordlist.get(i); %>

留言者：<%=single.getAuthor() %>

<p>

留言时间：<%=single.getTime() %>

<p>

留言标题：<%=single.getTitle() %>

<p>

留言内容：<textarea rows="7"cols="30" readonly="readonly"><%=single.getContent() %></textarea>

}}

</body>

</html>

6.在web.xml文件中配置Servlet。

<description>This is the description of my J2EE component</description>

<display-name>This is the display name of my J2EE component</display-name>

<servlet-name>WordServlet</servlet-name>

<servlet-class>com.yxq.servlet.WordServlet</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>WordServlet</servlet-name>

<url-pattern>/addWord</url-pattern>

</servlet-mapping>

4.购物区-购物车

1.创建封装商品信息的值JavaBean——GoodsSingle。

package com.yxq.valuebean;

public class GoodsSingle {

private String name; //保存商品名称

private float price; //保存商品价格

private int num; //保存商品购买数量

public String getName() {

return name;

}

public void setName(String name) {

this.name = name;

}

public int getNum() {

return num;

}

public void setNum(int num) {

this.num = num;

}

public float getPrice() {

return price;

}

public void setPrice(float price) {

this.price = price;

}

2.创建工具JavaBean——MyTools。

package com.yxq.toolbean;

import java.io.UnsupportedEncodingException;

import java.text.SimpleDateFormat;

import java.util.Date;

public class MyTools {

public static String changeTime(Date date){

SimpleDateFormat format=new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");

return format.format(date);

}

public static int strToint(String str){ //将String型数据转换为int型数据的方法

if(str==null||str.equals(""))

str="0";

int i=0;

try{

i=Integer.parseInt(str);

}catch(NumberFormatException e){

i=0;

e.printStackTrace();

}

return i;

}

public static String toChinese(String str){ //进行转码操作的方法

if(str==null)

str="";

try {

str=new String(str.getBytes("iso-8859-1"),"utf-8");

} catch (UnsupportedEncodingException e) {

str="";

e.printStackTrace();

}

return str;

}

3.创建实现购物车的JavaBean——ShopCar。

package com.yxq.toolbean;

import java.util.ArrayList;

import com.yxq.valuebean.GoodsSingle;

public class ShopCar {

private ArrayList buylist=new ArrayList(); //用来存储购买的商品

public void setBuylist(ArrayList buylist) {

this.buylist = buylist;

}

/**

* @功能向购物车中添加商品

* @参数 single为GoodsSingle类对象，封装了要添加的商品信息

public void addItem(GoodsSingle single){

if(single!=null){

if(buylist.size()==0){ //如果buylist中不存在任何商品

GoodsSingle temp=new GoodsSingle();

temp.setName(single.getName());

temp.setPrice(single.getPrice());

temp.setNum(single.getNum());

buylist.add(temp); //存储商品

}

else{ //如果buylist中存在商品

int i=0;

for(;i<buylist.size();i++){ //遍历buylist集合对象，判断该集合中是否已经存在当前要添加的商品

GoodsSingle temp=(GoodsSingle)buylist.get(i); //获取buylist集合中当前元素

if(temp.getName().equals(single.getName())){ //判断从buylist集合中获取的当前商品的名称是否与要添加的商品的名称相同

//如果相同，说明已经购买了该商品，只需要将商品的购买数量加1

temp.setNum(temp.getNum()+1); //将商品购买数量加1

break; //结束for循环

}

if(i>=buylist.size()){ //说明buylist中不存在要添加的商品

GoodsSingle temp=new GoodsSingle();

temp.setName(single.getName());

temp.setPrice(single.getPrice());

temp.setNum(single.getNum());

buylist.add(temp); //存储商品

}

/**

* @功能从购物车中移除指定名称的商品

* @参数 name表示商品名称

public void removeItem(String name){

for(int i=0;i<buylist.size();i++){ //遍历buylist集合，查找指定名称的商品

GoodsSingle temp=(GoodsSingle)buylist.get(i); //获取集合中当前位置的商品

if(temp.getName().equals(name)){ //如果商品的名称为name参数指定的名称

if(temp.getNum()>1){ //如果商品的购买数量大于1

temp.setNum(temp.getNum()-1); //则将购买数量减1

break; //结束for循环

}

else if(temp.getNum()==1){ //如果商品的购买数量为1

buylist.remove(i); //从buylist集合对象中移除该商品

}

4.创建实例的首页面index.jsp，在该页面中直接将请求转发给了Servlet，index.jsp页面的具体代码如下：

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

<%@ page import="java.util.ArrayList" %>

<%@ page import="com.yxq.valuebean.GoodsSingle" %>

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>My JSP 'index.jsp' starting page</title>

<!--

--></head>

<% request.setCharacterEncoding("GB2312");

String uname = request.getParameter("username");

session.setAttribute("username",uname);

%><body>

<%!

static ArrayList goodslist=new ArrayList(); //用来存储商品

static{ //静态代码块

String[] names={"2012韩版男士板鞋","冬季男板鞋","时尚休闲男靴","加绒加厚高帮男鞋"}; //商品名称

float[] prices={55,65,75,85}; //商品价格

for(int i=0;i<4;i++){ //初始化商品信息列表

//定义一个GoodsSingle类对象来封装商品信息

GoodsSingle single=new GoodsSingle();

single.setName(names[i]); //封装商品名称信息

single.setPrice(prices[i]); //封装商品价格信息

single.setNum(1); //封装购买数量信息

goodslist.add(i,single); //保存商品到goodslist集合对象中

}

session.setAttribute("goodslist",goodslist); //保存商品列表到session中

response.sendRedirect("show1.jsp"); //跳转到show.jsp页面显示商品

%><a href="welcome.jsp">返回</a>

</body>

</html>

5.创建处理用户访问首页面请求的Servlet——IndexServlet。

package com.yxq.servlet;

import java.io.IOException;

import java.util.ArrayList;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import javax.servlet.http.HttpSession;

import com.yxq.valuebean.GoodsSingle;

public class IndexServlet extends HttpServlet {

private static ArrayList goodslist=new ArrayList();

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

doPost(request,response);

}

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

HttpSession session=request.getSession();

session.setAttribute("goodslist",goodslist);

response.sendRedirect("show.jsp");

}

static{ //静态代码块

String[] names={"热血类动漫","科幻类动漫","运动类动漫","推理类动漫","冒险类动漫"};

float[] prices={10.0f,15.0f,25.0f,23.0f,18.0f};

for(int i=0;i<5;i++){

GoodsSingle single=new GoodsSingle();

single.setName(names[i]);

single.setPrice(prices[i]);

single.setNum(1);

goodslist.add(single);

}

6.在web.xml文件中配置IndexServlet。

<description>This is the description of my J2EE component</description>

<display-name>This is the display name of my J2EE component</display-name>

<servlet-name>IndexServlet</servlet-name>

<servlet-class>com.yxq.servlet.IndexServlet</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>IndexServlet</servlet-name>

<url-pattern>/index</url-pattern>

</servlet-mapping>

7.创建show1.jsp页面，该页面用来显示初始化的商品信息列表。

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

<%@ page import="java.util.ArrayList" %>

<%@ page import="com.yxq.valuebean.GoodsSingle" %>

<tbody><tr><a href="welcome.jsp">点此返回宝贝界面</a>

<tr>

</tr>

</tbody></table><br><br>

<%String name=(String)session.getAttribute("username");

out.println("<br>"+"欢迎您"+name+"来到这里，祝您购物愉快！"+"<br>");%>

<% ArrayList goodslist=(ArrayList)session.getAttribute("goodslist"); %>

<tr height="50"><td colspan="3" align="center">提供商品如下</td></tr>

</tr>

<% if(goodslist==null||goodslist.size()==0){ %>

<tr height="100"><td colspan="3" align="center">没有商品可显示！</td></tr>

}

else{

for(int i=0;i<goodslist.size();i++){

GoodsSingle single=(GoodsSingle)goodslist.get(i);

</tr>

}

<td align="center" colspan="3"><a href="shopcar.jsp">查看购物车</a></td>

</tr>

</table>

8.创建接受并处理“购买”。“移除”、和“清空购物车”请求的Servlet——BuyServlet。

package com.yxq.servlet;

import java.io.IOException;

import java.util.ArrayList;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import javax.servlet.http.HttpSession;

import com.yxq.toolbean.MyTools;

import com.yxq.toolbean.ShopCar;

import com.yxq.valuebean.GoodsSingle;

public class BuyServlet extends HttpServlet {

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

doPost(request,response);

}

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

String action=request.getParameter("action"); //获取action参数值

if(action==null)

action="";

if(action.equals("buy")) //触发了“购买”请求

buy(request,response); //调用buy()方法实现商品的购买

if(action.equals("remove")) //触发了“移除”请求

remove(request,response); //调用remove()方法实现商品的移除

if(action.equals("clear")) //触发了“清空购物车”请求

clear(request,response); //调用clear()方法实现购物车的清空

}

//实现购买商品的方法

protected void buy(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

HttpSession session=request.getSession();

String strId=request.getParameter("id"); //获取触发“购买”请求时传递的id参数，该参数存储的是商品在goodslist对象中存储的位置

int id=MyTools.strToint(strId);

ArrayList goodslist=(ArrayList)session.getAttribute("goodslist");

GoodsSingle single=(GoodsSingle)goodslist.get(id);

ArrayList buylist=(ArrayList)session.getAttribute("buylist"); //从session范围内获取存储了用户已购买商品的集合对象

if(buylist==null)

buylist=new ArrayList();

ShopCar myCar=new ShopCar();

myCar.setBuylist(buylist); //将buylist对象赋值给ShopCar类实例中的属性

myCar.addItem(single); //调用ShopCar类中addItem()方法实现商品添加操作

session.setAttribute("buylist",buylist);

response.sendRedirect("show.jsp"); //将请求重定向到show.jsp页面

}

//实现移除商品的方法

protected void remove(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

HttpSession session=request.getSession();

ArrayList buylist=(ArrayList)session.getAttribute("buylist");

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

ShopCar myCar=new ShopCar();

myCar.setBuylist(buylist); //将buylist对象赋值给ShopCar类实例中的属性

myCar.removeItem(MyTools.toChinese(name)); //调用ShopCar类中removeItem ()方法实现商品移除操作

response.sendRedirect("shopcar.jsp");

}

//实现清空购物车的方法

protected void clear(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

HttpSession session=request.getSession();

ArrayList buylist=(ArrayList)session.getAttribute("buylist"); //从session范围内获取存储了用户已购买商品的集合对象

buylist.clear(); //清空buylist集合对象，实现购物车清空的操作

response.sendRedirect("shopcar.jsp");

}

9.在web.xml文件中配置BuyServlet，其配置代码如下：

<description>This is the description of my J2EE component</description>

<display-name>This is the display name of my J2EE component</display-name>

<servlet-name>BuyServlet</servlet-name>

<servlet-class>com.yxq.servlet.BuyServlet</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>BuyServlet</servlet-name>

<url-pattern>/doCar</url-pattern>

</servlet-mapping>

10.创建shopcar.jsp页面，该页面用来显示用户购买的商品。

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

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

<%@ page import="com.yxq.valuebean.GoodsSingle" %>

<%if(session.getAttribute("username")==null)

{String name=(String)session.getAttribute("username");

out.println(name+"购买的商品如下");}

<jsp:useBean id="myCar" class="com.yxq.toolbean.ShopCar" scope="session"/>

ArrayList buylist=myCar.getBuylist(); //获取实例中用来存储购买的商品的集合

float total=0; //用来存储应付金额

<tr height="50"><td colspan="5" align="center">购买的商品如下</td></tr>

</tr>

<% if(buylist==null||buylist.size()==0){ %>

<tr height="100"><td colspan="5" align="center">您的购物车为空！</td></tr>

}

else{

for(int i=0;i<buylist.size();i++){

GoodsSingle single=(GoodsSingle)buylist.get(i);

String name=single.getName(); //获取商品名称

float price=single.getPrice(); //获取商品价格

int num=single.getNum(); //获取购买数量

float money=((int)((price*num+0.05f)*10))/10f; //计算当前商品总价，并进行四舍五入

total+=money; //计算应付金额

<td>

</td>

</tr>

}

<td colspan="3"><a href="docar.jsp?action=clear">清空购物车</a></td>

结论：

时间飞快，几个月的毕业设计即将结束了。这几个月内，在刘书霞老师的指导下进行的毕业设计让我受益匪浅。

首先，我的自学能力得到了加强。在实习的前几天主要进行的是与java有关的知识讲解及其他预备知识的普及。在这之前由于种种原因我没有系统的学过java，所以对于java我几乎一无所知。尽管老师讲的比较快。但我还是竭尽所能的去跟上老师的节奏。在这个过程中老师曾给我打过一剂预防针---对语法的理解无需太清晰，会用就可以。所以我只需了解大概框架及原理即可。这就教会了我自学的一种方法——可以在第一遍时不求甚解，先了解知识框架，之后再在使用的过程中不断的加深对知识的理解，从而较快的学会知识并利用之用于实践。

其次我的实际的操作能力得到了加强。知识讲解告一段落之后我们便进入到了紧张而又短暂的项目中。但不得不说刚开始代码书写总是出错。由于对原理理解的不够透彻，语言使用缺乏足够经验所以进度极慢。在经过了多次讨论以及与老师的交流我们渐渐的对项目有了一个较为合理的理解，所以再次投入的过程就比较顺利。

最后是团队协作能力的提升。在整个项目完成过程中团队协作有着不可替代不可或缺的作用。在这一过程中我们当中谁若遇到问题其他成员还可以帮助解决从而加快了项目完成速度提高了相率。

这次实习拉近了我与社会的距离，也让自己在实习工作中开拓了视野，增长了才干。社会和大学一样也是一个学习和受教育的地方，但无论是在哪片广阔的天地里，我为将来更加激烈的竞争打下了更为坚实的基础。但仅仅靠这几个月的学习还是远远不够的，还不足以应对激烈的竞争。在以后的学习中，我还得更加努力的学习，培养自己的能力，进一步完善自己！

致谢：

实习报告是在刘老师的悉心指导下完成的。在实习这几个月时间里，刘老师无论是在指导报告写作上还是在提供文献参考上都给予了我很大的帮助。老师严谨的治学风格，平易近人的态度，缜密的学术思维都对我以后的求学和工作都有深刻的影响。感谢老师在我的报告撰写过程给予我的鼓励和帮助，无论是从实习报告的选题，还是研究方法，乃至报告的写作都给予了我极大的帮助和关键的指导。同时也感谢我的同学对我的实习报告提出的建议。此外还要表示对参考文献作者的感谢。在此，谨向给予我关怀和鼓励的各位同学和老师致以深深的谢意。

参考文献：

[1] 沈嫒芬，林万莲主编.信息服务及其利用.武汉：华中师范大学出版社，1996.7

[2] 张成昱，来强，王平，赵仪，孔黎.分布式网络信息资源重构模式及系统实现.清华大学学报，2003.2

[3] 薛华，薛福任，工作流技术及其在网上审批中的应用，计算机工程与应用，2004.22

[4] 胡杰，党延忠，基于web的工作流技术在文档管理系统中的应用，计算机工程与应用，2003. 12

[5] 皮晓青，唐守渊，冯驰，梁伟，王润，科技资源开放与共享策略[M]重庆:西南师范人学出版社2009.2

[6] 严蔚敏，吴伟民主编 . 数据结构清华大学出版社 2006.5

[7] (美) 斯贝尔(Spell，B.) 著；董梁，刘艳译 java高级编程（第二版）清华大学出版社 2006.11

[8] 刘俊亮王清华 JSP Web开发学习实录清华大学出版社 2011.7（1）

[9] 薛华成.管理信息系统（第三版）北京:清华大学出版社,1999,25-27.

[10] 邝孔武,王晓敏.信息系统分析与设计（第一版）[M].北京:清华大学出版社,1999.

[11] 刘京华.Java Web整合开发王者归来[M]. 北京清华大学出版社2010

[12]刘春晓,孟祥福,李昕.基于Jboss的数据库连接池研究与实现[J]. 微处理机: 2008

[13] Craig Walls, Ryan BreidenBach. Spring In Action[M]. Manning Publications. 2006

[14]张孝祥. 深入Java Web开发内幕——核心基础[M]. 北京电子工业出版社

相关推荐