这个在jsp中很容易实现,但是springBoot不推荐使用jsp,建议使用thymeleaf,下面是在thymeleaf中引入界面的方法

1.修改配置文件

spring:
mvc:
static-path-pattern: /static/**
thymeleaf:
prefix:
classpath: /templates/

在springBoot中,静态资源(如js,css,图片,静态html)都放在static当中,动态资源(如html)放在templates中。

这是我的目录结构

现在我要在index.html中引入main.html

2.修改main.html

用<div th:fragment="main"></div>把整个页面包裹起来,包裹的内容就是你要在index.html引入的部分

3.修改index.html,因为springBoot自动把static当作当前目录,所以要用../templates/shop/main而不是/templates/shop/main。

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div th:replace="../templates/shop/main :: main"></div>
</body>
</html>

thymeleaf:在一个页面中引入其它的页面的更多相关文章

  1. 同一页面中引入多个JS库产生的冲突解决方案(转)

    发生JS库冲突的主要原因:与jQuery库一样,许多JS库都使用‘$’符号作为其代号.因此在一个页面中引入多个JS库,并且使用‘$’作为代号时,程序不能识别其代表哪个库(这个是我自己的解释,但更深的原 ...

  2. 页面中引入js的几种方法

    通常大家最为熟悉的是一下两种方法: 在页面中直接写入<script type="text/javascript">js代码</script>. 在页面中引入 ...

  3. 页面中引入mui 地址选择,点击页面中其他input时页面回到顶部

    问题:在页面中引入mui地址选择时,点击页面中的input页面会滚到顶部(谷歌浏览器中出现的bug),在手机上点击input会出现跳动.开始的时候是想修改mui.min.js里的滚动事件,但是后来找到 ...

  4. JSP页面中引入另一个JSP页面

    一个JSP页面中引入另一个JSP页面,相当于把另一个JSP页面的内容复制到对应位置: <%@include file="date.jsp" %> 一般页面的top和bo ...

  5. 在UTF-8页面中引入编码为GBK的JavaScript文件乱码问题了

    原文地址:http://js8.in/2009/12/11/%E5%AF%B9%E5%BC%95%E7%94%A8%E5%A4%96%E9%83%A8javascript%E9%A1%B5%E9%9D ...

  6. https http 混合访问_https 页面中引入 http 资源的解决方式

    解决android 5.0 webview不能加载http与https混合内容的问题 在使用WebView加载https资源文件时,如果认证证书不被Android认可,那么会出现无法成功加载对应资源问 ...

  7. 在html页面中引入另一个html页面

    我们在使用html编写一个网站的时候,通常情况下头部和尾部是相同的,如果一个网站的每个页面都把这些代码写一遍,不仅浪费时间,还显得重复代码很多,所以此时把重复的页面单独摘出来,在用到的时候从外部直接引 ...

  8. jsp页面中引入文件路径问题的解决方案(使用request获取项目路径)【原创】

    在项目页面中,总会引入一些js和css,相对路径or绝对路径的选择就显得至关重要了!下面是项目中遇到的问题和解决方案,做一下记录! 环境: myEclipse创建工程,使用jsp+css+js,项目目 ...

  9. Java项目在jsp页面中引入jquery框架的步骤

    环境:在Java  web项目中引入juqery框架 工具:MyEclipse8.5 [步骤如下] A:新建一个Java web项目TestJquery,在WebRoot目录下创建一个jquery文件 ...

随机推荐

  1. MySQL实战45讲学习笔记:第三十四讲

    一.本节概述 在实际生产中,关于 join 语句使用的问题,一般会集中在以下两类: 1. 我们 DBA 不让使用 join,使用 join 有什么问题呢?2. 如果有两个大小不同的表做 join,应该 ...

  2. 五、原子操作(CAS)

    原子操作(CAS) 一.CAS(Compare And Set) ​ Compare And Set(或Compare And Swap),CAS是解决多线程并行情况下使用锁造成性能损耗的一种机制,C ...

  3. HBuilder webApp开发(七)微信/QQ/新浪/腾讯微博分享

    链接 https://blog.csdn.net/zhuming3834/article/details/51706256

  4. 一个动态构建 LambdaExpression Tree 的示例

    直接贴代码了: public class ExpressionTreeBuildingSampleTwo : Sample { public override string Name { get; } ...

  5. Logstash:处理多个input

    Logstash:处理多个input Logstash的整个pipleline分为三个部分: input插件:提取数据. 这可以来自日志文件,TCP或UDP侦听器,若干协议特定插件(如syslog或I ...

  6. mongodb复杂条件查询 (or与and)

    分类专栏: mongodb   版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:https://blog.csdn.net/tjbsl/ ...

  7. Activex在没有电子秤api的情况下获取串口数据

    大二做B/S架构的项目使用了安衡电子秤CHS-D+R和一款扫码枪,两个设备的串口使用一样,这款电子秤是相当的坑,没有开发的api,无奈只能自己开发Activex了,在B/S架构中进行引用Activex ...

  8. Scrapy 运行多个爬虫

    本文所使用的 Scrapy 版本:Scrapy==1.8.0 一个 Scrapy 项目下可能会有多个爬虫,本文陈述两种情况: 多个爬虫 所有爬虫 显然,这两种情况并不一定是等同的.假设当前项目下有 3 ...

  9. git报错 - remote: HTTP Basic: Access denied

    十年河东,十年河西,莫欺少年穷 学无止境,精益求精 git 拉取代码报: remote: HTTP Basic: Access denied,这是因为你的GIT密码修改后,需要重新认证授权,那么怎么操 ...

  10. SPC软控件提供商NWA的产品在各行业的应用(石油天然气行业)

    Northwest Analytical (NWA)是全球领先的“工业4.0”制造分析SPC软件控件提供商.产品(包含: NWA Quality Analyst , NWA Focus EMI 和 N ...