1.为页面添加footer

Templates文件夹下新建HTML文件:

 <!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org"> <body> <div th:fragment="copy">
&copy; 2011 The Good Thymes Virtual Grocery
</div> </body> </html>

在主文件添加

 <div th:include="footer :: copy"></div>

即可。

运行结果如下:

2.th:includeth:replace之间的区别

th:include将片段的内容包含在其主机标签中,但th:replace实际上将用片段替换主机标签

3.可参数化的片段签名

前台插入代码:

 <div th:fragment="frag (a,b)">
<p th:text="hello + ${a} + ' - ' + ${b}">...</p>
</div> <div th:include="::frag (zhang,san)">...</div>
<div th:include="::frag (a=li,b=si)">...</div>

运行结果如下:

3.文本内联

采用inline关键字可以将表达式嵌入文本。

以下两种方式等价:

 <h1>Hello : <b th:text="${user.name}">姓名</b></h1>
<p th:inline="text">Hello, [[${user.name}]]!</p>

运行结果:

此外,还可以签入Js文件

 <script th:inline="javascript">
/*<![CDATA[*/
... var username = /*[[${session.user.name}]]*/ 'Sebastian'; ...
/*]]>*/
</script>

Thymeleaf学习记录(7)--页面引入/片段引入的更多相关文章

  1. Thymeleaf学习记录(1)--启动模板及建立Demo

    Thymeleaf是什么? Thymeleaf是适用于Web和独立环境的现代服务器端Java模板引擎.相比于JSP,Thymeleaf更简洁,渲染性能更好,维护性更好,它可以XML/XHTML/HTM ...

  2. Thymeleaf学习记录(6)--迭代及条件语法

    迭代: 条件选择: IF-THEN: (if) ? (then) IF-THEN-ELSE: (if) ? (then) : (else) 默认: (value) ?: (defaultvalue) ...

  3. Thymeleaf学习记录(5)--运算及表单

    Thymeleaf文本及预算: 字面 文本文字:'one text','Another one!',... 号码文字:0,34,3.0,12.3,... 布尔文字:true,false 空字面: nu ...

  4. Thymeleaf学习记录(4)--$/*/#/@语法

    表达式符号 Thymeleaf对于变量的操作主要有$\*\#三种方式: 变量表达式: ${...},是获取容器上下文变量的值. 选择变量表达式: *{...},获取指定的对象中的变量值.如果是单独的对 ...

  5. Thymeleaf学习记录(2)--自动编译设置

    了方便每次修改HTML文件都能实时刷新,做一下更改. 在application.properties文件加入以下命令: #thymeleaf start spring.thymeleaf.mode=H ...

  6. Vue学习记录-画页面

    webstorm 因为之前开发ReactNative的时候,选择了webstorm,这回转战Vue,自然还是用它.如果什么也不做的话,打开Vue工程,编辑区域基本上没有语法高亮.怎么办呢? 安装插件( ...

  7. Thymeleaf学习记录(8)--表达式基本对象

    基础对象 #ctx:上下文对象 /* * ====================================================================== * See ja ...

  8. Thymeleaf学习记录(3)--语法

    语法: 标准表达式语法 简单表达: 变量表达式: ${...} 选择变量表达式: *{...} 消息表达式: #{...} 链接网址表达式: @{...} 字面 文本文字:'one text','An ...

  9. vue第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法)

    第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法) #课程目标 了解 vue 框架的特点 掌握创建 vue 实例 掌握 data ...

随机推荐

  1. Jquery、Ajax实现新闻列表页分页功能

    前端页面官网的开发,离不开新闻列表,新闻列表一般都会有分页的功能,下面是我自己总结加查找网上资料写的一个分页的功能,记录一下. 首先,官网的开发建立在前后端分离的基础上: 再有,后端小伙伴们提供列表页 ...

  2. 线程池(Linux实现)

    讨论QQ群:135202158 本文技术参考了sourceforge项目c thread pool,链接:http://sourceforge.net/projects/cthpool/ 线程池如上一 ...

  3. Spring注解大全,汇总版

    Spring使用的注解大全和解释 注解 解释 @Controller 组合注解(组合了@Component注解),应用在MVC层(控制层),DispatcherServlet会自动扫描注解了此注解的类 ...

  4. LINUX云服务器 安装 nginx

    什么是nginx? 是一个高性能的 HTTP 和反向代理服务器,也是一个IMAP/POP3/SMTP 代理服, 是一个asynchronousservers异步服务器 为什么使用nginx? 因为它的 ...

  5. windows安装tesseract-OCR及使用

    tesseract是Python的一个OCR(光学字符识别)库 首先下载tesseract的exe安装文件   https://github.com/UB-Mannheim/tesseract/wik ...

  6. SuperMap(无对应字段)空间属性挂接

    一.数据准备 将一个没有基本属性的模型数据集和一个含有位置等属性信息的shp属性表进行挂接,两组数据之间没有连接字段,但同属一个坐标系下,只能通过空间位置信息进行属性挂接. 二.数据处理 基本思路:将 ...

  7. ui4-5

    2016PS第4-5周 图像的高级编辑方法: 4-1.用变换将照片放入相框 1.打开素材文件01-1.jpg 2.执行:文件/置入,选素材01-2.jpg 3.执行:编辑/变换/缩放,缩小照片,暂不退 ...

  8. 使用NHibernate(1)--资料汇总

    NHibernate最新版本是4.0,目前还只是alpha版,没有发布.稳定版本是3.3,项目中用的也是这个版本,所以以后的介绍都是基于这个版本的. 在网上找了一下相关的学习资料,现汇总如下: NHi ...

  9. linux mint 18.2 install erlang

    由于Linux min 18.2仓库中的erlnag是18.2,我们手动安装最新版本,参考 https://www.erlang-solutions.com/resources/download.ht ...

  10. 微服务Kong(五)——添加一个用户(Consumer)

    在本节中,我们将学习如何添加一个用户(consumer)到KONG实例中.用户是与使用您的API的个人相关联,可用于跟踪,访问管理等. NOTE:本节假设您已经正确启用了密钥验证插件.如果没有,请参考 ...