Thymeleaf详解_java

1 Thymeleaf？

Thymeleaf 是一个 Java 库。它是一个 XML/XHTML/HTML5 模板引擎，能够将一组转换应用于模板文件，以显示应用程序生成的数据和/或文本。

它更适合在 Web 应用程序中提供 XHTML/HTML5，但它可以处理任何 XML 文件，无论是在 Web 应用程序中还是在独立应用程序中。

Thymeleaf 的主要目标是提供一种优雅且格式良好的模板创建方式。为了实现这一点，它基于定义在DOM（文档对象模型）上执行预定义逻辑的 XML 标记和属性，而不是将该逻辑显式地编写为模板内的代码。

它的架构允许快速处理模板，依赖于解析文件的智能缓存，以便在执行期间使用尽可能少的 I/O *** 作。

总结为一句话：Thymeleaf是适用于Web和独立环境的现代服务器端Java模板引擎。

模板引擎介绍

它的架构允许快速处理模板，依赖于解析文件的智能缓存，以便在执行期间使用尽可能少的 I/O *** 作。

模板引擎（这里特指用于Web开发的模板引擎）是为了使用户界面与业务数据（内容）分离而产生的，它可以生成特定格式的文档，用于网站的模板引擎就会生成一个标准的html文档。从字面上理解模板引擎，最重要的就是模板二字，这个意思就是做好一个模板后套入对应位置的数据，最终以html的格式展示出来，这就是模板引擎的作用。
对于模板引擎的理解，可以这样形象的做一个类比：开会！相信你在上学初高中时候每次开会都要提前布置场地、拿小板凳、收拾场地。而你上了大学之后每次开会再也不去大 *** 场了,每次开会都去学校的大会议室，桌子板凳音响主席台齐全，来个人即可，还可复用……。模板引擎的功能就类似我们的会议室开会一样开箱即用，将模板设计好之后直接填充数据即可而不需要重新设计整个页面。提高页面、代码的复用性。

不仅如此，在Java中模板引擎还有很多，模板引擎是动态网页发展进步的产物，在最初并且流传度最广的jsp它就是一个模板引擎。jsp是官方标准的模板，但是由于jsp的缺点比较多也挺严重的，所以很多人弃用jsp选用第三方的模板引擎，市面上开源的第三方的模板引擎也比较多，有Thymeleaf、FreeMaker、Velocity等模板引擎受众较广。

模板引擎在web领域的主要作用：让网站实现界面和数据分离，这样大大提高了开发效率，让代码重用更加容易。

2 Thymeleaf 可以处理什么样的模板？

从官方的介绍来看，Thymeleaf的目标很明确：

Thymeleaf的主要目标是为您的开发工作流程带来优雅自然的模板-HTML可以在浏览器中正确显示，也可以作为静态原型工作，从而可以在开发团队中加强协作。
Thymeleaf拥有适用于Spring Framework的模块，与您喜欢的工具的大量集成以及插入您自己的功能的能力，对于现代HTML5 JVM Web开发而言，Thymeleaf是理想的选择——尽管它还有很多工作要做。

并且随着市场使用的验证Thymeleaf也达到的它的目标和大家对他的期望，在实际开发有着广泛的应用。Thymeleaf作为被Springboot官方推荐的模板引擎，一定有很多过人和不寻同之处：

2.1 动静分离

Thymeleaf选用html作为模板页，这是任何一款其他模板引擎做不到的！Thymeleaf使用html通过一些特定标签语法代表其含义，但并未破坏html结构，即使无网络、不通过后端渲染也能在浏览器成功打开，大大方便界面的测试和修改。

2.2 开箱即用

Thymeleaf提供标准和Spring标准两种方言，可以直接套用模板实现JSTL、 OGNL表达式效果，避免每天套模板、改JSTL、改标签的困扰。同时开发人员也可以扩展和创建自定义的方言。

开箱即用，Thymeleaf 允许您处理六种模板，每一种都称为模板模式：

XML
有效的 XML
XHTML
有效的 XHTML
HTML5
旧版 HTML5

此外，Thymeleaf在曾经还有一次大的版本升级，从Thymeleaf2.0—>Thymeleaf3.0。在Thymeleaf2.0时代，Thymeleaf基于xml实现，虽然它带来了许多出色强大的功能，但有时会降低性能效率，那个时候Thymeleaf的性能真的太差而被很多人所吐槽带来了很不好的印象。

但是Thymeleaf3.0对比Thymeleaf2.0有着翻天覆地的变化，几乎是全部重写了整个Thymeleaf引擎，在性能、效率上相比Thymeleaf2有了很大改善，能够满足更多项目的需求，且Thymeleaf3.0不再基于xml所以在html环境下有着更宽松的编程环境。

此外，Thymelaf3.0在方言、独立于Java Servlet API、重构核心API、片段表达等方面有着巨大提升和改善，具体可以参看Thymeleaf3十分钟参考指南。

3 Thymeleaf 常用标签

th：标签	说明
th：insert	页面片段包含（类似JSP中的include标签）
th:replace	页面片段包含（类似JSP中的include标签）
th:each	元素遍历（类似JSP中的c:forEach标签）
th:if	条件判断，如果为真
th:unless	条件判断，如果为假
th:switch	条件判断，进行选择性匹配
th:case	条件判断，进行选择性匹配
th:object	变量声明
th:with	变量声明
th:attr	通用属性修改
th:attrprepend	通用属性修改，将计算结果追加前缀到现有属性值
th:attrappend	通用属性修改，将计算结果追加后缀到现有属性值
th:value	属性值修改，指定标签属性值
th:href	用于设定链接地址
th:src	用于设定链接地址
th:text	用于指定标签显示的文本内容
th:utext	用于指定标签显示的文本内容，对特殊标签不转义
th:fragment	声明片段
th:remove	移除片段

4 Thymeleaf 标准表达式语法

Thymeleaf为变量所在域提供了一些内置对象:

#ctx：表示上下文对象
#vars：表示上下文变量
#locale：表示上下文区域设置
#request：表示（仅限Web Context）HttpServletRequest对象
#response：表示（仅限Web Context）HttpServletResponse对象
#session：表示（仅限Web Context）HttpSession对象
#servletContext：表示（仅限Web Context）ServletContext对象

Thymeleaf为变量所在域提供了一些表达式功能对象:

#dates：java.util.Date的功能方法类。
#calendars: 类似#dates，面向java.util.Calendar
#numbers: 格式化数字的功能方法类。
#strings：字符串对象的功能类，contains,startWiths,prepending/appending等等。
#objects: 对objects的功能类 *** 作。
#bools: 对布尔值求值的功能方法。
#arrays：对数组的功能类方法。
#lists: 对lists功能类方法
#sets
#maps
#aggregates: 对数组或者集合创建聚合的功能方法，th:text="${#aggregates.sum(o.orderLines.{purchasePrice * amount})}"
#messages: 在变量表达式中获取外部信息的功能类方法。
#ids：处理可能重复的id属性的功能类方法。

4.1 常用语法表达式？

说明	功能	表达式语法
变量表达式	获取上下文中变量值	${...}
选择变量表达式	用于从被选定对象获取属性值	*{...}
消息表达式	用于Thymeleaf模板页面国际化内容的动态替换和展示	#{...}
链接URL表达式	用于页面跳转或者资源的引入	@{...}
片段表达式	用来标记一个片段模板，并根据需要移动或传递给其他模板。	~{...}

4.2 其他语法表达式及案例

4.2.1编辑插件

使用Thymeleaf模板，必须保证引入Thymeleaf依赖及模板渲染路径

1、在pom文件中引入Thymeleaf模板依赖


    org.springframework.boot
    spring-boot-starter-thymeleaf

2、在Thymeleaf模板中引入模板渲染路径

4.2.1 url + th:href + @{...}

URL 是 Web 应用程序模板中的一等公民，Thymeleaf 标准方言对它们有特殊的语法，@语法：@{...}

@{...} 用表示链接URL表达式，用于页面跳转或者资源的引入，一般用于href，src等标签属性，其中资源地址可以static目录下的静态资源，也可以是互联网中的绝对资源。

th:href 用于设定链接地址

URL 用分为绝对路径和相对路径

${...} 变量表达式，用于获取上下文中变量值

(xxx=yyy,aaa=www) 参数表达式，用于传参，可以传一个到多个，多个参数用逗号隔开

引入css

 
引入JavaScript：

 
超链接：

超链接

绝对路径：

1）@{https://www.baidu.com/} 绝对路径结果为：https://www.baidu.com

案例：
view

相对路径

1）@{userList} 相对当前路径结果为：http://localhost/thymeleaf/user/userList

2）@{./userList} 相对当前路径结果为：http://localhost/thymeleaf/user/userList

3）@{../tiger/home} 相对当前路径结果为：http://localhost/thymeleaf/tiger/home

4）@{/tiger/home} 相对应用根目录结果为：http://localhost/thymeleaf/tiger/home（推荐）

5），@ 以 "/" 开头相对应用根目录，否则是相对当前

案例：

href="product/list.html" th:href="@{/product/list}">Product List

th:href="@{${url}(orderId=${o.id})}">view
th:href="@{'/details/'+${user.login}(orderId=${o.id})}">view

th:href="@{userList(id=9527)}">view

th:href="@{userList(id=9527,name=华安)}">view

http://localhost/thymeleaf/userList?id=9527&name=admin -->

th:href="@{userList(id=9527,name=${userName})}">view

4.2.2 字符 + 文本 + th:class + th:text + 特殊字符空格

th:class 用表示链接URL表达式，用于页面跳转或者资源的引入。

th:text 用于指定标签显示的文本内容

+ 用于连接字符串，字符串中有空格，则字符串需用单引号引起

${...} 变量表达式，用于获取上下文中变量值，可以获取字符串值，获取javabean，获取list集合和map集合(list集合和map集合在循环中讲解)。

(xxx=yyy,aaa=www) 参数表达式，用于传参，可以传一个到多个，多个参数用逗号隔开

案例：

样式p>

中国p>

中国p>

userNamep>

浅浅的微笑p>

${....} 可以javaBean对象值 -->

${....} 可以使用 ${对象名.对象属性 }或者 ${对象名['对象属性']}获取属性值-->

浅浅的微笑p>

浅浅的微笑p>

4.2.2 数字 + 运算符 + 数字运算

th:text="80" 用表示数字文字。

th:text="8+8" 用于数字计算 8+8=16

+ 用于连接字符串，字符串中有空格，则字符串需用单引号引起

${...} 变量表达式，用于获取上下文中变量值

8p>

8 + 8p>

8 + 8+' Love '+9+9p>

8 + 8+' Love '+(9+9)p>

p>

值为 60 p>

值为 50 p>

值为 4p>

4.2.3 布尔判断 + 逻辑运算

th:if="布尔值" 用表示是否显示数据，true表示显示数据，false表示不显示。

th:text="8+8" 用于数字计算 8+8=16

比较运算符用 > 表示 >、$lt; 表示 <、$ge; 表示 >=、$le; 表示 <=、$eq; 表示 ==, not 表示(非) ! 、$neq;/$ne; 表示（不等） !=

${...} 变量表达式，用于获取上下文中变量值

布尔p>

true and truep>

已结婚p>

3">5 大于 3p>

4">5 大于 4p>

=8 and 7 !=8">10大于等于8，且 7 不等于 8 p>

!falsep>

not(false)p>

 3">5 大于 3p>

 4">5 大于 4p>

4.2.4 三元运算符 +

th:if="布尔值" 用表示是否显示数据，true表示显示数据，false表示不显示。

th:text="8+8" 用于数字计算 8+8=16

比较运算符用 > 表示 >、$lt; 表示 <、$ge; 表示 >=、$le; 表示 <=、$eq; 表示 ==, not 表示(非) ! 、$neq;/$ne; 表示（不等） !=

${...} 变量表达式，用于获取上下文中变量值

5?'7大':'5大'">三元运算符p>

p>

=18?'成年':'未成年'):'age等于 null'">p>

p>

已婚p>

th:if="${prodStat.count} > 1"
th:text="'Execution mode is ' + ( (${execMode} == 'dev')? 'Development' : 'Production')"

4.2.4 日期格式化

#{...} 消息表达式或资源表达式，用于Thymeleaf模板页面国际化内容的动态替换和展示，一般配合.properties使用，

文本外部化是从模板文件中提取模板代码的片段，以便可以将它们保存在单独的文件(通常是.properties文件)中,文本的外部化片段通常称为“消息”。通俗易懂得来说#{…}语法就是用来读取配置文件中得数据的。在Thymeleaf你可以使用#{...}语法获取消息，具体实例代码如下：

首先在templates目录下建立home.properties中写入以下内容：

bigsai.nane=bigsai
bigsai.age=22
province=Jiang Su

在application.properties中加入以下内容：

spring.messages.basename=templates/home

在Thymeleaf中读取配置的文件了：

消息表达


name
#{bigsai.name}">


年龄
#{bigsai.age}">


province
#{province}">

日期格式化，可以通过时间工具类#dates来对日期进行格式化

span>

4.3 TH常用标签

4.3.1 th:utext 转义标签 + th:utext 非转义标签

th:text 用于指定标签显示的文本内容，但字符串中的特殊字符会进行自动转义成字符

th:utext 用于指定标签显示的文本内容，但字符串中的特殊字符不会进行自动转义成字符，会被当做html元素进行解析

map .addAttribute("china", "Chian,USA,UK");

标签会被默认转义为字符p>

不会转义p>

4.3.2 th:arr 设置属性（不常用）

HTML5 所有的属性，都可以使用 th:* 的形式进行设置值，但实际开发中不经常用，因为可以直接使用th:对应属性替换

th:attr 用于够更改其设置的标签的属性值

<a href="http://baidu.com" th:attr="title='百度'">百度a>

<a href="http://baidu.com" th:title="'百度'">百度a>（推荐）

<a href="" th:attr="title='前往百度',href='http://baidu.com'">前往百度a>

<a href="" th:title="'前往百度'", th:href="'http://baidu.com'">前往百度a>（推荐）

<a href="userList.html" th:attr="href=@{/user/userHome}">用户首页a>

<a href="#" th:attr="id='9527',data-target='user'">归海一刀a>

th:abc="9527"p>

th:abc123="华安"p>

4.3.3 单选框 th:checked + 下拉框th:selected 设置

th:checked 用于从后台动态获取单选框数据回显及选中

th:selected 用于从后台动态获取下拉框数据回显及选中

th:autofocus 用于规定在页面加载后下拉列表应该自动获得焦点;

th:checked 之前-->

<input type="checkbox" name="option1" checked/>是否已婚1？span>

<input type="checkbox" name="option2" checked="checked"/>是否已婚2？span>

--- 

th:checked 之后-->

<input type="checkbox" name="option3" th:checked="${isMarry}"/>是否已婚3？span>

<input type="radio" name="option4" th:checked="${isMarry}"/>是否本科？span>

<input type="radio" name="option5" th:checked="!${isMarry}"/>是否应届生？span>

---------------------

th:selected 之后-->

<select>

<option>aoption>

<option th:selected="${isMarry}">已婚option>

<option th:selected="${!isMarry}">未婚option>

select>

<input type="text" th:autofocus="false">

<input type="text" th:autofocus="true">

<input type="text" th:autofocus="false">

4.3.4 循环标签 th:each

th:each 遍历需要用到标签：th:each

对list取值具体使用为,其中item就相当于遍历每一次的对象名。

对Map取值对于Map取值你可以${Map名['key']}来进行取值。也可以通过${Map名.key}取值，当然你也可以使用${map.get('key')}(java语法)来取值

状态变量loopStatus
如果不指定为变量+Stat

index: 当前迭代对象的index（从0开始计算）
count: 当前迭代对象的index(从1开始计算)
size: 被迭代对象的大小 current:当前迭代变量
even/odd: 布尔值，当前循环是否是偶数/奇数（从0开始计算）
first: 布尔值，当前循环是否是第一个
last: 布尔值，当前循环是否是最后一个

<option th:each="user: ${users}" th:text="${user.dept}" th:selected="${dept} eq ${user.dept}">市场部option>

<tr th:each="user,status : ${users}" th:style="${status.odd}?'background-color:#c2c2c2'">

<td th:text = "${status.count}">td>

<td th:text = "${user.id}">td>

<td th:text = "${user.username}">td>

tr>

Map取值


 place:

 th:text="${userMap.get('place')}">


 feeling:

 userMap['feeling']}">


 feeling:

 userMap.name">

4.3.5 th:if标签 + th:unless标签

th:if 用表示if判断

th:unless 用于表示else判断

已婚1p>

未婚p>

4.3.6 th:switich标签 + th:case标签多条件判断

th:switch 用表示 switch 判断

th:case 用于表示 case 判断

<div th:switch="1">

 管理员p>

 *** 作员p>

 未知用户p>

div>

<div th:switch="-1">

 管理员p>

 *** 作员p>

 未知用户p>

div>

<div th:switch="${isMarry}">

 已婚p>

 已成年p>

 未婚p>

div>

4.3.7 th:with 标签 + th:object 标签

th:with 用定义变量，例如th:with="isEven=${prodStat.count}%2==0"，定义多个变量可以用逗号分隔。

th:object 用于指定对象

*{....} 选择变量表达式

变量表达式不仅可以写成${...}，而且还可以写成*{...}。

但是，有一个重要的区别：星号语法对选定对象而不是整个上下文评估表达式。也就是说，只要没有选定的对象，美元(${…})和星号(*{...})的语法就完全一样。

什么是选定对象？使用th:object属性的表达式的结果。就可以选定对象，具体实例如下：

Name: 赛span>.p>
 Age: 18span>.p>
 Detail: 好好学习span>.p>

当然*{…}也可和${…}混用。上面的代码如果不使用选定对象，完全等价于：

Name: 赛span>.p>
 Age: 18span>.p>
 Detail: 好好学习span>.p>

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/langs/917267.html

Thymeleaf详解

发表评论

评论列表（0条）