JavaWeb——JSP实现书城首页

最新推荐文章于 2024-02-03 12:31:04 发布
最新推荐文章于 2024-02-03 12:31:04 发布
阅读量1.5k 收藏 25
点赞数
分类专栏： Java Web 文章标签： java servlet tomcat
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Liwo4418/article/details/131060657
版权

实验名称：

JSP实现书城首页

实验目的：

（1）了解JSP的特点及其运行原理

（2）掌握JSP的基本语法

（3）熟悉JSP指令和隐式对象的使用

（4）掌握JSP动作元素的使用

实验内容及原理：

能使用include指令进行jsp页面的开发，实现传智书城首页。

实验设备及实验步骤：

Win10操作系统+JDK软件+Eclipse软件+Apache-tomcat软件

1、创建动态WEB项目

2、编写一个head.jsp的顶部页面

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<div id="divhead">
    <table cellspacing="0" class="headtable">
        <tr>
            <td>
                <a href="index.jsp">
                    <img src="${pageContext.request.contextPath}/client/images/logo.png" width="200" height="60" border="0" />
                </a>
            </td>
            <td style="text-align:right">
                <img src="${pageContext.request.contextPath}/client/images/cart.gif" width="26" height="23" style="margin-bottom:-4px" />&nbsp;<a href="#">购物车</a>
                | <a href="#">帮助中心</a>
                | <a href="#">我的帐户</a>
                | <a href="${pageContext.request.contextPath}/client/register.jsp">新用户注册</a>

            </td>
        </tr>
    </table>
</div>

3、编写一个menu_search.jsp的内容页面

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<div id="divmenu">
    <a href="#">文学</a>
    <a href="#">生活</a>
    <a href="#">计算机</a>
    <a href="#">外语</a>
    <a href="#">经管</a>
    <a href="#">励志</a>
    <a href="#">社科</a>
    <a href="#">学术</a>
    <a href="#">少儿</a>
    <a href="#">艺术</a>
    <a href="#">原版</a>
    <a href="#">科技</a>
    <a href="#">考试</a>
    <a href="#">生活百科</a>
    <a href="#" style="color:#FFFF00">全部商品目录</a>
</div>
<div id="divsearch">
    <form action="#" id="searchform">
        <table width="100%" border="0" cellspacing="0">
            <tr>
                <td style="text-align:right; padding-right:220px">
                    Search
                    <input type="text" name="textfield" class="inputtable" id="textfield" value="请输入书名"
                           onmouseover="this.focus();"
                           onclick="my_click(this, 'textfield');"
                           onBlur="my_blur(this, 'textfield');"/>
                    <a href="#">
                        <img src="${pageContext.request.contextPath}/client/images/serchbutton.gif" border="0" style="margin-bottom:-4px" onclick="search()"/>
                    </a>
                </td>
            </tr>
        </table>
    </form>
</div>

4、编写一个foot.jsp的底部页面

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<div id="divfoot">
    <table width="100%" border="0" cellspacing="0">
        <tr>
            <td rowspan="2" style="width: 10%"><img
                    src="${pageContext.request.contextPath}/client/images/logo.png"
                    width="195" height="50" style="margin-left: 175px" />
            </td>
            <td style="padding-top: 5px; padding-left: 50px"><a href="#">
                <font color="#747556"><b>CONTACT US</b> </font> </a>
            </td>
        </tr>
        <tr>
            <td style="padding-left: 50px"><font color="#CCCCCC"> <b>COPYRIGHT
                2015 &copy; BookStore All Rights RESERVED.</b> </font>
            </td>
        </tr>
    </table>
</div>

5、在content.jsp的内容页面中使用include指令引入其他公用jsp文件。

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>首页</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/client/css/main.css" type="text/css" />
    <!-- 导入首页轮播图css和js脚本 -->
    <link type="text/css" href="${pageContext.request.contextPath}/client/css/autoplay.css" rel="stylesheet" />
    <script type="text/javascript" src="${pageContext.request.contextPath}/client/js/autoplay.js"></script>
</head>
<body class="main">
<!-- 1.网上书城顶部 start -->
<%@include file="/head.jsp"%>
<!-- 网上书城顶部  end -->

<!-- 2.网上书城菜单列表  start -->
<%@include file="/menu_search.jsp" %>
<!-- 网上书城菜单列表  end -->

<!-- 3.网上书城首页轮播图  start -->
<div id="box_autoplay">
    <div class="list">
        <ul>
            <li><img src="/client/ad/index_ad.jpg" width="900" height="335" /></li>
            <li><img src="/client/ad/index_ad1.jpg" width="900" height="335" /></li>
            <li><img src="/client/ad/index_ad2.jpg" width="900" height="335" /></li>
            <li><img src="/client/ad/index_ad3.jpg" width="900" height="335" /></li>
            <li><img src="/client/ad/index_ad4.jpg" width="900" height="335" /></li>
        </ul>
    </div>
</div>
<!-- 网上书城首页轮播图  end -->
<!-- 4.公告板和本周热卖  start -->
<div id="divcontent">
    <table width="900px" border="0" cellspacing="0">
        <tr>
            <td width="497">

                <img src="${pageContext.request.contextPath}/client/images/billboard.gif" width="497" height="38" />
                <table cellspacing="0" class="ctl">
                    <tr>
                        <td width="485" height="29">
                            尊敬的网上书城用户， 　　<br>
                            　　为了让大家有更好的购物体验，3月25日起，当日达业务关小黑屋回炉升级！<br>具体开放时间请留意公告，感谢大家的支持与理解，祝大家购物愉快！<br>
                            3月23日<br>
                            传智播客 网上书城系统管理部<br>
                        </td>
                    </tr>
                </table>
            </td>
            <td style="padding:5px 15px 10px 40px">
                <table width="100%" border="0" cellspacing="0">
                    <tr>
                        <td>
                            <img src="${pageContext.request.contextPath}/client/images/hottitle.gif" width="126" height="29" />
                        </td>
                    </tr>
                </table>
                <table width="100%" border="0" cellspacing="0">
                    <tr>
                        <td style=" text-align:center">
                            <a href="#">
                                <img src="${pageContext.request.contextPath}/client/bookcover/105.jpg" width="102" height="130" border="0" />
                            </a>
                            <br />
                        </td>
                        <td style=" text-align:center">
                            <a href="#">
                                <img src="${pageContext.request.contextPath}/client/bookcover/106.jpg" width="102" height="130" border="0" />
                            </a>
                            <br />
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</div>
<!-- 公告板和本周热卖  end -->
<!--5. 网上书城底部 start -->
<%@ include file="/foot.jsp" %>
<!-- 网上书城底部  end -->
</body>
</html>

6、运行结果图截图

 

梨涡泥窝
关注
  • 0
    点赞
  • 踩
  • 25
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
jsp页面实现网站的网站首页代码
信息技术的博客
07-20 1636
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <%@taglib prefix="s"
Javaweb传智书城
06-07
Java web传智书城项目
【软件应用开发】jsp+servlet实现网上书城（简易版）
木成河的博客
05-27 2930
jsp+servlet实现网上书城（简易版） 编程语言：Java（jdk 1.8） 开发IDE：eclipse 数据库：MySQL 使用Tomcat部署工程后访问：http://localhost:8080/BooksCart 工程结构： booklist.jsp <%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" %> <%@ taglib prefix="c" uri=
实现传智播客部分首页代码
qq_53344479的博客
03-31 946
代码打包放到百度网盘里了 链接：https://pan.baidu.com/s/1rIceEnFJaE2CtC0A1qxkhg 提取码：2k6x
基于JSP实现图书馆图书管理系统
最新发布
cxdsjing的博客
02-03 819
【请注意，这个只是部分功能，还有功能未截图出亦或截图并不能表示全部含义，请转至演示站查看具体效果】学生角色游客角色管理员角色学生登录查看图书详情管理员登录图书借阅查看所有图书用户管理图书归还图书管理借阅记录查看罚款缴纳密码修改。
jsp实现级联菜单 jsp实现级联菜单
05-16
jsp实现级联菜单jsp实现级联菜单jsp实现级联菜单jsp实现级联菜单jsp实现级联菜单
设置java web工程中默认访问首页的几种方式
weixin_30788619的博客
12-06 394
1.demo中最常见的方式是在工程下的web.xml中设置(有时候根据业务可能需要设置action，在action中处理逻辑加载跳转什么的，比较少)： <welcome-file-list> <welcome-file>index.jsp</welcome-file> </welcome-file-list> 2.使用Urlr...
java web设置首页_java web设置默认首页方法
weixin_42352981的博客
02-16 3303
本文部分来自：https://blog..net/caiwenfeng_for_23/article/details/45486233引文：在构建项目后，我们在使用Tomcat启动后设置默认首页方法有以下几种：1.静态页面在tomcat安装目录下，/conf/web.xml 中，添加以下内容：/WEB-INF/views/index.jsp2. 动态页面同样是在web.xml中servlet中加入...
Javaweb-传智书城JSP页面案例
weixin_55689279的博客
11-19 2372
项目目录 1.首页设置 2.文件移植 3.修改JSP页面中的地址和链接 4.抽出页面代码 1.首页设置： 在项目文件中的WeContent目录下创建一个名为index.jsp的页面文件，该文件使用jsp:forword动作元素跳转到项目客户端展示的首页 2.文件移植： 将client文件复制到WeContent下，并将client文件下的.html文件改为.jsp文件 3.修改JSP页面中的地址和链接： 4.抽取页面代码： 虽然已成功将HTML文件改为了JSP文件，并能够成功访问，但是在ind
在JSP页面中输出字符" * "组成的金字塔
a771454823的博客
06-22 2610
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/...
javaWeb传智播客网上书城项目源码(设计以及实现论文).zip
09-24
javaWeb传智播客网上书城项目源码(设计以及实现论文).zipjavaWeb传智播客网上书城项目源码(设计以及实现论文).zipjavaWeb传智播客网上书城项目源码(设计以及实现论文).zipjavaWeb传智播客网上书城项目源码(设计以及实现论文).zipjavaWeb传智播客网上书城项目源码(设计以及实现论文).zipjavaWeb传智播客网上书城项目源码(设计以及实现论文).zipjavaWeb传智播客网上书城项目源码(设计以及实现论文).zipjavaWeb传智播客网上书城项目源码(设计以及实现论文).zipjavaWeb传智播客网上书城项目源码(设计以及实现论文).zipjavaWeb传智播客网上书城项目源码(设计以及实现论文).zipjavaWeb传智播客网上书城项目源码(设计以及实现论文).zipjavaWeb传智播客网上书城项目源码(设计以及实现论文).zipjavaWeb传智播客网上书城项目源码(设计以及实现论文).zipjavaWeb传智播客网上书城项目源码(设计以及实现论文).zipjavaWeb传智播客网上书城项目源码(设计以及实现论文).zipjavaW
传智书城前端JSP代码
11-30
使用JSP实现了传智书城的前台页面。包含js，css，jsp以及相关的图片素材（注意！此资源不含数据库，仅仅是一个前台页面，仅仅适合新手操作）
12_JavaWeb——Filter&Listener案例资源
05-02
此资源与我的博客12_JavaWeb——Filter&Listener中的案例对应，在11_JavaWeb——Cookie&Session案例资源基础上加上了过滤器，实现了对未登录用户的拦截，希望有所帮助。
Javaweb——疫情出入信息管理系统
06-23
疫情出入信息管理系统（其他修改版本） 项目开发工具 1. IDEA 2020.1 2. Navicat Premium 15 项目开发环境 1.java version“1.8.0. 202” 2.Tomcat 8.5.72 有源代码包，数据库文件和说明文件 详细信息分布内容参考 此项目仅供学习使用
JavaWeb开发——JSP技术
03-24
此文章包含JSP简介、JSP运行原理、JSP标签与标签库及其使用、JSP的内置对象与作用域对象、EL表达式和MVC模式的简介，...适用于任何学习JavaWeb开发中，需要了解JSP技术的人群，希望这篇文章能对大家的学习有所帮助！
基于JavaWeb+Jsp实现的校园宿舍管理系统
03-27
本项目是一套基于JavaWeb+Jsp实现的校园宿舍管理系统，主要针对计算机相关专业的正在做bishe的学生和需要项目实战练习的Java学习者。 包含：项目源码、数据库脚本等，该项目可以直接作为bishe使用。 项目都经过严格...
基于JavaWeb+jsp实现企业员工工资管理系统
03-24
本项目是一套基于Servlet+Jsp实现的学生成绩管理系统，主要针对计算机相关专业的正在做bishe的学生和需要项目实战练习的Java学习者。 包含：项目源码、数据库脚本等，该项目可以直接作为bishe使用。 项目都经过严格...
jsp实现传智书城登录+注册+后台管理
qq_52108058的博客
05-17 3989
文章目录一、用户登入（前台+后台）思路1. 案例演示2. 实现步骤2.1 login.jsp代码2.1 UserServlet代码二、用户注册思路1. 案例演示2. 实现步骤2.1 register.jsp代码2.1 UserServlet代码三、后台管理1. 后台管理一思路1. 案例演示2. 实现步骤2.1 设置left.jsp代码2.1 设置findProductByIdServlet代码2. 后台管理二思路1. 案例演示2. 实现步骤2.1 设置list.jsp代码2.2 findProductByI
简单的Java web（JSP+Sevlet+Java+mysql)源码分享
wx1998114的博客
11-15 1081
引言：Java web项目主要采用mvc的的设计思想，系统主要采用java+jsp+servlet+mysql+eclipse实现，具有登陆、分页、导出excel，增删改查等功能,适合初学者，满足基本的实训需求，以下是推荐的几款，总有适合你的java web源码，用于学习非常好！。
JavaWeb——HTTP
10-07
JavaWeb中的HTTP指的是在JavaWeb开发中使用的超文本传输协议(HTTP)。HTTP是一种简单的请求-响应协议，通常在TCP/IP协议上运行。它通过客户端和服务器之间的交互来传输文本和超文本数据，如HTML、图片、音乐、视频等。JavaWeb开发中使用HTTP协议来实现客户端和服务器之间的通信，通过HTTP请求向服务器发送请求，服务器接收请求后处理并返回相应的HTTP响应。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值