1-9springboot之thymeleaf常用语法（html页面）
一、引用命名空间 <html xmlns:th="http://www.thymeleaf.org">
在html中引入此命名空间，可避免编辑器出现html验证错误，虽然加不加命名空间对Thymeleaf的功能没有任何影响。
引入css
<link th:href="@{/font-awesome/css/font-awesome.css}" rel="stylesheet" />
引入js
<script type="text/javascript" th:src="@{/js/jquery-1.11.2.min.js}"></script>
二、输出内容
2.1 <p th:text="#{home.welcome}">Welcome to our grocery store!</p>
说明：
1. th:text 用来将内容输出到所在标签的body中。
2. #{home.welcome} 用来引入数据home对象中的 welcome属性。
3. 可以用th:utext 用来显示“unescaped ” 的html内容。
2.2 <p>Today is: <span th:text="${today}">13 February 2011</span></p>
说明：${today} 用来引用 today 变量
三、访问对象
${param.x} 返回名为x 的 request参数。（可能有多个值）
${session.x} 返回名为x的Session参数。
${application.x} 返回名为 servlet context 的参数。
四、基本语法
4.1 #｛home.welcome｝ -- 访问数据
4.2 #{home.welcome(${session.user.name})} -- 格式化数据 当 home.welcome 为 "abcdegf{0}" 类似这种内容时。（多个参数以逗句分隔）。
4.3 ${today} --- 访问变量
4.4 访问基本对象
#ctx: the context object.
#vars: the context variables.
#locale: the context locale.
#request: (only in Web Contexts) the HttpServletRequest object.
#response: (only in Web Contexts) the HttpServletResponse object.
#session: (only in Web Contexts) the HttpSession object.
#servletContext: (only in Web Contexts) the ServletContext object.
其它公共对象参考: http://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html#appendix-a-expression-basic-objects
4.5 日期的输出
<span th:text="${#calendars.format(today,'dd MMMM yyyy')}">13 May 2011</span>
4.6 星号语法
<div th:object="${session.user}">
<p>Name: <span th:text="*{firstName}">Sebastian</span>.</p>
<p>Surname: <span th:text="*{lastName}">Pepper</span>.</p>
<p>Nationality: <span th:text="*{nationality}">Saturn</span>.</p>
</div>
4.7 输出URL
<a href="product/list.html" th:href="@{/product/list}">Product List</a>
<a href="details.html" th:href="@{/order/{orderId}/details(orderId=${o.id})}">view</a>
4.8 使用代码段
<div th:insert="~{commons :: main}">...</div>
4.9 直接输出内容
<span th:text="'working web application'"> -- 输出字符
<span th:text="2013 + 2"> -- 输出数据表达式
<div th:if="${user.isAdmin()} == false"> --输出布尔表达式
<div th:if="${user.id}>2"> --输出判断表达式
<span th:text="'Welcome to our application, ' + ${user.name} + '!'"> -- 带变量的
4.10 条件表达式
<tr th:class="${user.id}? 'even' : 'odd'">
...
</tr>
<tr th:class="${user.id} > 2? 'even' : 'odd'">
...
</tr>
<tr th:class="${row.even}? 'alt'">
...省略 false 结果的表达方式
</tr>
<div th:object="${session.user}">
...省略 true 结果的表达方式
<p>Age: <span th:text="*{age}?: '(no age specified)'">27</span>.</p>
</div>
<span th:text="${user.name} ?: _">no user authenticated</span> --不做任何处理时用下划线 _ 表示
4.11 格式化
<td th:text="${{user.lastAccessDate}}">...</td> --${{.}} 调用默认的格式化器来输出结果。
4.12 预处理
<p th:text="${__#{article.text('textVar')}__}">Some text here...</p>
说明：thymeleaf 的处理模板内容的顺序与书写顺序无关，只能通过 __${expression}__ ，来将需要先一步计算出来后面 要用的变量指定为优化处理。
五、设置 Attribute 值
5.1 设置任何Attribute 的方法
<input type="submit" value="Subscribe!" th:attr="value=#{subscribe.submit}"/> --设置单个
<img src="../../images/gtvglogo.png" th:attr="src=@{/images/gtvglogo.png},title=#{logo},alt=#{logo}" /> --一次设置多个
5.2 设置一些内置的Attribute的方法
<li><a href="product/list.html" th:href="@{/product/list}">Product List</a></li>
<form action="subscribe.html" th:action="@{/subscribe}">
<input type="submit" value="Subscribe!" th:value="#{subscribe.submit}"/>
<img src="../../images/gtvglogo.png" th:src="@{/images/gtvglogo.png}" th:alt-title="#{logo}" /> -- 一次设置多个（alt title）的方法
其它的可用属性：http://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html#setting-value-to-specific-attributes
5.3 设置html里没有指的任何属性的语法
<span th:whatever="${user.name}">...</span> ---whatever 可以换成任何你想设的属性
六、循环输出的语法
6.1 基本循环
<tr th:each="prod : ${prods}">
<td th:text="${prod.name}">Onions</td>
<td th:text="${prod.price}">2.41</td>
<td th:text="${prod.inStock}? #{true} : #{false}">yes</td>
</tr>
6.2 循环状态的使用
<table>
<tr>
<th>NAME</th>
<th>PRICE</th>
<th>IN STOCK</th>
</tr>
<tr th:each="prod,iterStat : ${prods}" th:class="${iterStat.odd}? 'odd'">
<td th:text="${prod.name}">Onions</td>
<td th:text="${prod.price}">2.41</td>
<td th:text="${prod.inStock}? #{true} : #{false}">yes</td>
</tr>
</table>
关于状态的其它信息的使用详细参考：http://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html#keeping-iteration-status
七、条件判断
7.1 if 和 unless
<a href="comments.html" th:href="@{/comments(prodId=${prod.id})}" th:unless="${#lists.isEmpty(prod.comments)}">view</a>
<a href="comments.html" th:href="@{/product/comments(prodId=${prod.id})}" th:if="${not #lists.isEmpty(prod.comments)}">view</a>
7.2 switch 语句
<div th:switch="${user.role}">
<p th:case="'admin'">User is an administrator</p>
<p th:case="${roles.manager}">User is a manager</p>
<p th:case="*">User is some other thing</p> --默认的 case 相当于default
</div>
八、模板 include
8.1 定义和引用代码块
定义代码块
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<body>
<div th:fragment="copy">
© 2011 The Good Thymes Virtual Grocery
</div>
</body>
</html>
引用代码块
<body>
...
<div th:insert="~{footer :: copy}"></div>
</body>
引用未用fragment 标注的代码块
<div id="copy-section">
© 2011 The Good Thymes Virtual Grocery
</div>
<body>
...
<div th:insert="~{footer :: #copy-section}"></div>
</body>
8.2 th:insert th:replace th:include 之间的区别
th:insert --- 插入代码块 th:replace -- 替换代码块会替换掉容器标签 th:include ---- 和insert相似但只会插入fragment标注body内的内容。
需要替换的片段内容：
<footer th:fragment="copy">
<script type="text/javascript" th:src="@{/plugins/jquery/jquery-3.0.2.js}"></script>
</footer>
导入片段：
<div th:insert="footer :: copy"></div>
<div th:replace="footer :: copy"></div>
<div th:include="footer :: copy"></div>
结果为：
<div>
<footer>
<script type="text/javascript" th:src="@{/plugins/jquery/jquery-3.0.2.js}"></script>
</footer>
</div>
<footer>
<script type="text/javascript" th:src="@{/plugins/jquery/jquery-3.0.2.js}"></script>
</footer>
<div>
<script type="text/javascript" th:src="@{/plugins/jquery/jquery-3.0.2.js}"></script>
</div>
8.3 带参数的代码段
<div th:fragment="frag (onevar,twovar)">
<p th:text="${onevar} + ' - ' + ${twovar}">...</p>
</div>
<div th:replace="::frag (${value1},${value2})">...</div>
<div th:replace="::frag (onevar=${value1},twovar=${value2})">...</div>
九、局部变量的使用示例
<div th:with="firstPer=${persons[0]}">
<p>
The name of the first person is <span th:text="${firstPer.name}">Julius Caesar</span>.
</p>
</div>
<div th:with="firstPer=${persons[0]},secondPer=${persons[1]}">
<p>
The name of the first person is <span th:text="${firstPer.name}">Julius Caesar</span>.
</p>
<p>
But the name of the second person is
<span th:text="${secondPer.name}">Marcus Antonius</span>.
</p>
</div>
十、注释
<!-- ... -->
十一、说明
以上只列出Thymeleaf了简要常用的语法和使用方式，更多详情的说明和规则请参见：http://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html#introducing-thymeleaf
1-9springboot之thymeleaf常用语法（html页面）的更多相关文章
- Thymeleaf常用语法：表达式语法之运算符
Thymeleaf表达式语法之常量分为字符串常量.数字常量.布尔值常量.空值常量:运算符分为算术运算符.关系运算符.条件运算符.无操作符. 开发环境:IntelliJ IDEA 2019.2.2Spr ...
- Thymeleaf常用语法：模板片断
系统中的很多页面有很多公共内容,例如菜单.页脚等,这些公共内容可以提取放在一个称为“模板片断”的公共页面里面,其它页面可以引用这个 “模板片断”内容. 一.模板片断的定义 可以是html标签,也可以使 ...
- Thymeleaf常用语法：模板注释
Thymeleaf模板注释分为标准HTML/XML注释.解析层注释.原型注释三种. 一.注释说明 1.标准HTML/XML注释 直接通过浏览器打开,不显示,Thymeleaf模板引擎解析也不处理,但查 ...
- thymeleaf常用语法
常用标签语法:①th:text<span th:text="${name}">1</span>注释:如果${name}有值则将替换掉1的值,若无则为1 ②t ...
- Thymeleaf常用语法：数据延迟加载
在处理模板时,可以由模板逻辑决定是否加载数据,以提高性能.在Spring Boot控制器中设置数据时,使用LazyContextVariable可以实现这功能. 开发环境:IntelliJ IDEA ...
- Thymeleaf常用语法：HTML属性设置
使用Thymeleaf的属性来设置HTML属性.(1)使用th:attr属性可以修改原来HTML节点的属性:(2)th:attr属性可以同时设置多个属性:(3)每一个HTML属性都有对应的Thymel ...
- Thymeleaf常用语法：模板文件中表达式调用Java类的静态方法
在模板文件的表达式中,可以使用“${T(全限定类名).方法名(参数)}”这种格式来调用Java类的静态方法. 开发环境:IntelliJ IDEA 2019.2.2Spring Boot版本:2.1. ...
- Thymeleaf常用语法：自定义数据转换类
在模板文件中,可以使用“${{...}}”表达式进行数据转换,Thymeleaf会使用配置好的数据转换类,来实现转换.例如一个User对象,简单起见假设有姓名和年龄两个字段,对象的toString() ...
- Thymeleaf常用语法：使用星号表达式
在处理模板时,一般情况都是使用变量表达式 ${...} 来显示变量,还可以使用选定对象表达式 *{...},它也称为星号表达式.如果在模板中先选定了对象,则需要使用星号表达式.Thymeleaf的内置 ...
随机推荐
- 错误记录（一）：VSCode
VS Code莫名其妙突然变卡. 后来重新安装,下载以前版本,设置防止循环,都不太管用. 最后想添加VS Code目录到windows扫描白名单,但因为系统之前是英文不太好看懂,所以又调回了中文. 这 ...
- python+pygame的导弹追踪鼠标游戏设置和说明
1.效果图 2.注意事项,代码里有说明 3.完整的代码 #导出模块 import pygame,sys from math import * #设置RESIZABLE前,必须导出下面的模块,否则报错 ...
- CGMH:Constrained Sentence Generation by Metropolis-Hastings Sampling解读
根据关键字生成句子: 读进关键字,随机选择处理手段(增删改)以及待处理word的位置,然后计算接受/拒绝概率,根据概率生成一个新的序列,再循环这一过程,循环次数是500,每次都将困惑度最低的生成句子放 ...
- bodyParser.urlencoded({ })里extended: true和false区别？？？
- 脚手架搭建的react中使用bootstrap
1.在react的index.html文件中加个jQuery的引入 <script src="http://cdn.bootcss.com/jquery/3.3.1/jquery.mi ...
- base64加/解密算法C++实现
base64编码原理:维基百科 - Base64 其实编码规则很简单,将字符串按每三个字符组成一组,因为每个字符的 ascii 码对应 0~127 之间(显然,不考虑其他字符集编码),即每个字符的二进 ...
- js 根据data-i 降序排列
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 数据分析--excel
excel 的使用 1.excel基础 1.数据类型 数字类型 字符类型 注意: 1.普通文本:默认作对齐,左上方没有小绿点,数字默认又对齐 2.数字存储为文本类型,美容默认为左对齐,左上方有小绿点 ...
- tensorflow 学习记录
函数变动 tf.train.SummaryWriter 变为 tf.summary.Filewritter 函数功能相同,仅仅是简单的重命名 ``` writer = tf.summary.FileW ...
- Java数组和方法
1. 数组可以作为方法的参数 package cn.itcast.day05.demo04; /* 数组可以作为方法的参数. 当调用方法的时候,向方法的小括号进行传参,传递进去的其实是数组的地址值. ...