主题网站的设计（jsp基本语法）

小张不嚣张꒰ঌ(˚ᆺ˚)໒꒱

已于 2023-04-13 10:52:30 修改

阅读量1.2k

点赞数 4

分类专栏：后端集合文章标签： java servlet 开发语言

于 2022-09-18 16:28:00 首次发布

本文链接：https://blog.csdn.net/qq_62599142/article/details/126918646

版权

后端集合专栏收录该内容

19 篇文章 0 订阅

订阅专栏

主题网站基本设计

前言
- 效果图如下
- - 提前准备
  - 整体思路分析

前言

在浏览主题网站时会发现，这些网站的不同须道都是用相同的Logo和频道导航做题头。本任务就是要完成一个主题网站。如果在每个页面的题头部分都放置网站的Logo和须道导航，导致的问题是，当网站Logo或须道需要更换时，需要对每一个频道的网页重新设计，这样维护既费时又费力。因此，为了便于实现快速维护，将两个相对独立的网页拼接成如图所示的页面，更改Logo图片时，只需要对top.html进行调整即可。

效果图如下

在这里插入图片描述

提前准备

我们这里使用的是idea软件，新建一个项目，配置好服务器之后，在web目录下，新建一个imgages文件夹，然后在web目录下分别新建
contact.html、contact,jsp、welcome.html、welcome.html、feature.jsp、feature.html、index.jsp、top.html具体如下图所示
在这里插入图片描述

然后将图片引入到images文件夹下（图片可以随便在网上下载一个，明白原理即可）

首先是html页面设计
1.top.html

在这里插入图片描述
2.feature.html

在这里插入图片描述
3.welcome.html

jsp页面设计（jsp设计的目的是为了top.html能够与相对应的html对应起来）

1.welcome.jsp

在这里插入图片描述

2.feature.jsp

在这里插入图片描述
3.contact.jsp

在这里插入图片描述

4.index.jsp
在tom.html中设置choice=1、2、3是为了传递参数，这参数可以用request.getParameter获取

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
  String path = request.getContextPath();
  String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html>
  <head>
    <base href="<%=basePath%>">
    <title>物理与电子信息学院网站</title>
    <meta http-equiv="pragma" 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="description" content="This is my page">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
  </head>
  <body>
  <%@ include file="top.html"%>
  <%
    //从超级链接获取特征值
    String s=request.getParameter("choice");
    //如果没有获取到，则默认为“1”
    if (s==null)
      s="1";
    int choice=Integer.parseInt(s);
    switch(choice){
      case 1:	%>    <!--专业频道，引入welcome.htm  -->
  <%@ include file="welcome.html" %>
  <%break;
    case 2:%>    <!--特色频道，引入special.htm  -->
  <%@ include file="feature.html"%>
  <%break;
    case 3:%>    <!--联络频道，引入contact.htm  -->
  <%@ include file="contact.html"%>
  <%break;
  }
  %>
  </body>
</html>

整体思路分析

首先创建四个html页面，然后创建四个jsp页面top.jsp页面是我们这个主题网站的网页部分，然后通过html相对应的jsp页面将其拼接成一个页面，最后的index页面是综合的，也是最后运行的页面.其中在里面通过request.getParameter(“choice”);来获取相对应的值，如果获取不到通过if默认为1，所以当我们打开页面的时候，呈现出来的是choice=1的值得页面
其实在此页面中也设置了top.html可以实现效果

如有侵权，请及时联系删除，谢谢配合。

小张不嚣张꒰ঌ(˚ᆺ˚)໒꒱

关注

4
点赞
踩
19

收藏

觉得还不错? 一键收藏
3
评论
主题网站的设计（jsp基本语法）

在浏览主题网站时会发现，这些网站的不同须道都是用相同的Logo和频道导航做题头。本任务就是要完成一个主题网站。如果在每个页面的题头部分都放置网站的Logo和须道导航，导致的问题是，当网站Logo或须道需要更换时，需要对每一个频道的网页重新设计，这样维护既费时又费力。因此，为了便于实现快速维护，将两个相对独立的网页拼接成如图所示的页面，更改Logo图片时，只需要对top.html进行调整即可。
复制链接

扫一扫