`thymeleaf` 简介

Thymeleaf 是一个跟 Velocity、FreeMarker 类似的模板引擎，它可以完全替代 JSP 。相较与其他的模板引擎，它有如下三个极吸引人的特点

Thymeleaf 在有网络和无网络的环境下皆可运行，即它可以让美工在浏览器查看页面的静态效果，也可以让程序员在服务器查看带数据的动态页面效果
Thymeleaf 开箱即用的特性。它提供标准和 spring 标准两种方言，可以直接套用模板实现 JSTL、 OGNL 表达式效果，避免每天套模板、改 jstl、改标签的困扰。同时开发人员也可以扩展和创建自定义的方言
Thymeleaf 提供 spring 标准方言和一个与 springMVC 完美集成的可选模块，可以快速的实现表单绑定、属性编辑器、国际化等功能

声明 `thymeleaf` 的命名空间

<html lang="en" xmlns:th="http://www.thymeleaf.org">

基础语法

`url` 表达式

引入 CSS 文件，示例如下

<link rel="stylesheet" type="text/css" th:href="@{/css/global.css}">

引入 js 文件，示例如下

<script type="text/javascript" th:src="@{/jquery/jquery-1.12.4.min.js}"></script>

url 不带参数

<dd><a th:href="@{/user/set}"><i class="layui-icon"></i>基本设置</a></dd>

url 带参数

<dd th:each="listHot:${listHot}"><a th:href="'/post/detail?id=' + ${listHot['id']}" th:text="${listHot['title']}"></a><span th:inline="text"><i class="iconfont icon-pinglun1"></i>[[${listHot['commentCount']}]]</span>
</dd>

常用的 `th` 标签

关键字	功能介绍	案例
th:id	替换id	`<input th:id="'xxx' + ${collect.id}"/>`
th:text	文本替换	`<p th:text="${collect.description}">description</p>`
th:utext	支持html的文本替换	`<p th:utext="${htmlcontent}">conten</p>`
th:object	替换对象	`<div th:object="${session.user}">`
th:value	属性赋值	`<input th:value="${user.name}" />`
th:with	变量赋值运算	`<div th:with="isEven=${prodStat.count}%2==0"></div>`
th:style	设置样式	`th:style="'display:' + @{(${sitrue} ? 'none' : 'inline-block')} + ''"`
th:onclick	点击事件	`th:onclick="'getCollect()'"`
th:each	属性赋值	`tr th:each="user,userStat:${users}">`
th:if	判断条件	`<a th:if="${userId == collect.userId}" >`
th:unless	和th:if判断相反	`<a th:href="@{/login}" th:unless=${session.user != null}>Login</a>`
th:href	链接地址	`<a th:href="@{/login}" th:unless=${session.user != null}>Login</a> />`
th:switch	多路选择配合th:case 使用	`<div th:switch="${user.role}">`
th:case	th:switch的一个分支	`<p th:case="'admin'">User is an administrator</p>`
th:fragment	布局标签，定义一个代码片段，方便其它地方引用	`<div th:fragment="alert">`
th:include	布局标签，替换内容到引入的文件	`<head th:include="layout :: htmlhead" th:with="title='xx'"></head> />`
th:replace	布局标签，替换整个标签到引入的文件	`<div th:replace="fragments/header :: title"></div>`
th:selected	selected选择框选中	`th:selected="(${xxx.id} == ${configObj.dd})"`
th:src	图片类地址引入	`<img class="img-responsive" alt="App Logo" th:src="@{/img/logo.png}" />`
th:inline	定义js脚本可以使用变量	`<script type="text/javascript" th:inline="javascript">`
th:action	表单提交的地址	`<form action="subscribe.html" th:action="@{/subscribe}">`
th:remove	删除某个属性	`<tr th:remove="all"> all:删除包含标签和所有的子节点`
th:attr	设置标签属性，多个属性可以用逗号分隔	比如 `th:attr="src=@{/image/aa.jpg},title=#{logo}"`，此标签不太优雅，一般用的比较少

`for` 循环

<tr   th:each="collect,iterStat : ${collects}"> <th scope="row" th:text="${collect.id}">1</th><td ><img th:src="${collect.webLogo}"/></td><td th:text="${collect.url}">Mark</td><td th:text="${collect.title}">Otto</td><td th:text="${collect.description}">@mdo</td><td th:text="${terStat.index}">index</td>
</tr>

我们可以通过遍历的 变量名 + Stat 来获取索引，是否是第一个或最后一个等。遍历的 变量名 + Stat 称作状态变量，其属性有

index：当前迭代对象的迭代索引，从 0 开始，这是索引属性
count：当前迭代对象的迭代索引，从 1 开始，这个是统计属性
size：迭代变量元素的总量，这是被迭代对象的大小属性
current：当前迭代变量
even/odd：布尔值，当前循环是否是偶数/奇数（从 0 开始计算）
first：布尔值，当前循环是否是第一个
last：布尔值，当前循环是否是最后一个

`js` 内联

如果我们想在 JavaScript 中使用内联操作，需要在 script 标签上声明 th:inline=“javascript” 然后就可以内联操作了

<script type="text/javascript" th:inline="javascript">// 下面就可以在 js 中使用 username 了var username = [[${user.name}]];
</script>

时间的格式化

java 代码

Date date = new Date();

thymeleaf 模板页面

<span th:text="${#dates.format(date ,'yyyy-MM-dd HH:mm:ss')}"></span>

结果页面

2019-05-30 10:03:05

史上最详 Thymeleaf 使用教程：https://blog.csdn.net/ljk126wy/article/details/90735989

thymeleaf使用总结相关推荐

SpringBoot-web开发(三): 模板引擎Thymeleaf
[SpringBoot-web系列]前文: SpringBoot-web开发(一): 静态资源的导入(源码分析) SpringBoot-web开发(二): 页面和图标定制(源码分析) 目录 1. 引入 ...
[JAVA EE] Thymeleaf 常用工具类
Thymeleaf 提供了丰富的表达式工具类,例如: #strings:字符串工具类 #dates:时间操作和时间格式化 #numbers:格式化数字对象的方法 #bools:常用的布尔方法 #str ...
[JAVA EE] Thymeleaf 高级用法：模板布局，带参数的引用片段，表单验证，常用校验注解
模板布局公共部分通常定义为模板布局:如页眉,页脚,公共导航栏.菜单等. 模板布局定义方法布局页中用 th:fragment 定义模板片段,其他页面用 th:insert 引用片段例如:foote ...
[JAVAEE] Thymeleaf 基本语法:常用表达式
Thymeleaf 基本语法常用表达式变量表达式 ${ } 使用方法:th:xx = "${ }" 获取对象属性值给 th:xx . 后台代码: Student s=new S ...
[JAVAEE] 初识ThymeLeaf
Thymeleaf 模板引擎 Thymeleaf 是一个服务器端 Java 模板引擎,适用于 Web 和独立环境, 能够处理 HTML,XML,JavaScript,CSS 甚至纯文本等. 常见的模板 ...
Thymeleaf 入门
基本项目结构: Thymeleaf配置: spring.thymeleaf.mode=LEGACYHTML5 spring.thymeleaf.cache=false spring.thymeleaf ...
thymeleaf+layui 展示table 报500
使用thymeleaf和layui的时候,使用layui的表格方法渲染,thymeleaf出现了渲染错误,报错信息如下: org.thymeleaf.exceptions.TemplateProces ...
thymeleaf : input/select/radio回显
thymeleaf中不用自己去写checked="checked" selected="selected"这种代码,他自己会选. input <input ...
controller不跳转页面的几个原因_光知道SpringBoot，不用thymeleaf就太不对了
之前的时候,我为了演示Linux配置提交项目执行环境,简单的整理了一下springboot得相关内容,但是在实际的开发过程中,SpringBoot得使用可不仅仅就是这一点点遍历而已,在SpringBo ...
Ajax+SpringBoot+Thymeleaf使用中遇到的跳转页面问题
前言:这周在使用 Ajax+Thymeleaf 时遇到一个问题,折腾了我很久,在此记录一下 Ajax+SpringBoot+Thymeleaf使用中遇到的跳转页面问题问题描述我的目的:通过 Aja ...

thymeleaf使用总结

目录

`thymeleaf` 简介

声明 `thymeleaf` 的命名空间

基础语法

`url` 表达式

常用的 `th` 标签

`for` 循环

`js` 内联

时间的格式化

thymeleaf使用总结相关推荐

最新文章

热门文章

thymeleaf使用总结

目录

thymeleaf 简介

声明 thymeleaf 的命名空间

基础语法

url 表达式

常用的 th 标签

for 循环

js 内联

时间的格式化

thymeleaf使用总结相关推荐

最新文章

热门文章

`thymeleaf` 简介

声明 `thymeleaf` 的命名空间

`url` 表达式

常用的 `th` 标签

`for` 循环

`js` 内联