Thymeleaf简介
在Java中,模板引擎可以帮助生成文本输出。常见的模板引擎包括FreeMarker、Velocity和Thymeleaf等
Thymeleaf是一个适用于Web和独立环境的现代服务器端Java模板引擎。
Thymeleaf 和 JSP比较:
Thymeleaf目前所作的工作和JSP有相似之处,Thymeleaf和JSP都是属于服务端渲染技术,Thymeleaf比JSP功能强大许多。
Thymeleaf就是SpringBoot 官方推荐使用的模板引擎。
搭建thymeleaf环境:
1、创建一个 SpringBoot 项目
<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-web</artifactId>
</dependency><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency><dependency><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId><version>1.18.14</version><scope>provided</scope>
</dependency>
2、编写跳转页面的 Controller
@Data
@AllArgsConstructor
@NoArgsConstructor
public class Student {private Integer id;private String name;private Integer age;private Date birthday;
}@Controller
public class IndexController {@RequestMapping("/index")public String index(Model model) {model.addAttribute("message", "HelloWorld");Student student = new Student(1, "李四", 23, new Date());model.addAttribute("student", student);Student student1 = new Student(1, "张三1", 23, new Date());Student student2 = new Student(2, "张三2", 23, new Date());Student student3 = new Student(3, "张三3", 23, new Date());List<Student> list = new ArrayList<>();list.add(student1);list.add(student2);list.add(student3);model.addAttribute("list", list);return "index";}
}
3、index.html 页面
在resources/templates目录创建一个index.html页面。
注意,必须加上命名空间xmlns:th="Thymeleaf",否则Thymeleaf的自定义标签没有提示。
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org/">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><!--使用th:text输出--><div th:text="${message}"></div><input type="text" th:id="${student.id}" th:name="${student.name}" th:value="${student.name}"/><!--循环--><table border="1"><tr><td>编号</td><td>姓名</td><td>年龄</td><td>生日</td></tr><tr th:each="student:${list}"><td th:text="${student.id}">1</td><td th:text="${student.name}">张三</td><td th:text="${student.age}">23</td><td th:text="${#dates.format(student.birthday, 'yyyy-MM-dd')}">1990-12-13</td></tr></table><!--取出集合中某一个--><div th:text="${list[0].name}"></div>
</body>
</html>

疑难问题
问题:为什么thymeleaf页面放在templates文件夹里面,并且后缀要是.html呢?
SpringBoot框架会将内置支持的功能组件放在spring-boot-autoconfigure-3.2.5.jar 包下,而 Thymeleaf 框架就是内置支持的。
所以在这个包里面可以找对应的自动配置代码,如图:

如果找默认的属性配置应该找XxxxProperties类,如图所示,Thymeleaf模板的前后缀如下:

所以Thymeleaf的页面存放在templates文件夹中,并且页面的后缀为.html。
常用标签:
- 数学运算
二元操作:+, - , * , / , %
一元操作: - (负)
- 逻辑运算
一元 : and or
二元 : !,not
- 比较运算(为避免转义尴尬,可以使用括号中的英文进行比较运算!)
比较:> , < , >= ,
等于:== , != ( eq , ne )
- 简单表达式
变量表达式: ${...}
选择变量表达式: *{...}
消息表达式: #{...}
URL 表达式: @{...}
代码段表达式: ~{...}
<body><!-- 使用th:text属性输出 --><div th:text="${message}" ></div><input type="text" th:id="${student.id}" th:name="${student.name}" th:value="${student.name}"><br/><!--循环--><table border="1"><tr><td>编号</td><td>姓名</td><td>年龄</td><td>生日</td></tr><tr th:each="student:${list}"><td th:text="${student.id}">1</td><td th:text="${student.name}">张三</td><td th:text="${student.age}">23</td><td th:text="${#dates.format(student.birthday, 'yyyy-MM-dd')}">1990-12-13</td></tr></table><!-- springmvc 保存了一个 model 对象: list --><!-- 获取所有 list --><p th:text="${list}"></p><!-- 获取 list 的第一个元素 --><p th:text="${list[0]}"></p><!-- 获取第一个 student 对象的 name 属性 --><p th:text="${list[0].name}"></p><!-- 也可以用 ['name'] 来获取第一个 student 对象的 name 属性 --><p th:text="${list[0]['name']}"></p><!-- 甚至可以调用方法! --><p th:text="${list[0].getName()}"></p><p th:text="${list[0]['name'].substring(0, 1)}"></p><!--判断Thymeleaf支持四种判断:th:if/th:unless、逻辑运算符(and、or、not)、三目运算符、switch。--><!--第一种:if & unless--><!-- 如果条件为真,执行标签内的内容 --><div th:if="${false}">天天18</div><div th:if="${list[0].name eq '张三1'}">张三1</div><div th:if="${list[0].name == '张三1'}">张三1</div><!-- 如果条件为假,执行标签内的内容 --><div th:unless="${false}">unless</div><!--第二种:and、or、not--><div th:if="${true or false}">真的18岁</div><div th:if="${not false}">真的别做梦</div><!--第三种:三目运算符--><span th:text="true ? '今年不是18岁' : '总算清醒了'"></span><br/><span th:text="${student.age eq 23} ? '今年是23' : '不是23'"></span><span th:text="${student.age eq 23 ? '今年23' : '不是23'}"></span><!--第四种:switch--><div th:switch="${student.age}"><div th:case="16">我今年16岁</div><div th:case="17">我今年17岁</div><div th:case="18">我今年18岁</div><div th:case="20">我今年20岁</div><div th:case="23">我今年23岁</div><div th:case="*">我年年18岁</div></div>
</body>
域对象
变量表达式的作用是:从web作用域里面取到对应的值,作用域包括 request、session、application。
@RequestMapping("/data")
public String data(HttpServletRequest request, HttpSession session) {Student student1 = new Student(1, "张三1", 23 , new Date());request.setAttribute("student1", student1);Student student2 = new Student(2, "张三2", 23, new Date());session.setAttribute("student2", student2);Student student3 = new Student(3, "张三3", 23, new Date());ServletContext application = request.getServletContext();application.setAttribute("student3", student3);return "data";
}
<body>request:<div>编号:<span th:text="${student1.id}"></span><br>姓名:<span th:text="${student1.name}"></span><br>年龄:<span th:text="${student1.age}"></span><br></div>session:<div>编号:<span th:text="${session.student2.id}"></span><br>姓名:<span th:text="${session.student2.name}"></span><br>年龄:<span th:text="${session.student2.age}"></span><br></div>application:<div>编号:<span th:text="${application.student3.id}"></span><br>姓名:<span th:text="${application.student3.name}"></span><br>年龄:<span th:text="${application.student3.age}"></span><br></div></body>
选择变量表达式
问题:取request、session、application作用域上的属性时,可以发现,我们需要重复编写student1、session.student2和application.student3三次,
如果student对象的属性有十几个怎么办?显然写十几次相同的代码不是我们想要解决方案。
针对这种问题,Thymeleaf提供了选择变量表达式来解决。
request: <br/>
<div th:object="${student1}">编号: <p th:text="*{id}"></p><br/>姓名:<p th:text="*{name}"></p> <br/>年龄:<p th:text="*{age}"></p><br/>
</div>session:<br/>
<div th:object="${session.student2}">编号: <p th:text="*{id}"></p><br/>姓名:<p th:text="*{name}"></p> <br/>年龄:<p th:text="*{age}"></p><br/>
</div>
作用域内容对象的空值处理
当获取一个作用域中不存在的对象属性,那么会返回一个null,但是有些情况下还通过点运算符获取对象属性,那么这是SpringBoot会报异常。有些情况下,就是根据某个对象是否为null来执行相应的操作。
--需求:获取session作用域中的user对象,如果不为null就输出name,如果为null,就输出空字符串,而不是报异常。
--分析:可以在调用对象或者方法的点(.)前面,使用问号(?)来判断null
编号:
内置工具对象:# 符号直接使用
除了基本对象, thymeleaf 还提供了一组工具对象,其实和java中对应的方法大同小异。
@RequestMapping(value = "/util")
public String set(Model model) {Set<String> names = new HashSet<String>() ;List<Integer> ids = new ArrayList<Integer>() ;for (int i = 0 ; i < 5 ; i ++) {names.add("boot-" + i) ;ids.add(i) ;}model.addAttribute("names", names) ;model.addAttribute("ids", ids) ;model.addAttribute("mydate", new Date()) ;return "util" ;
}
<body><p th:text="${#dates.format(mydate,'yyyy-MM-dd')}"/><p th:text="${#dates.format(mydate,'yyyy-MM-dd HH:mm:ss.SSS')}"/><hr/><p th:text="${#strings.replace('www.baidu.cn','.','$')}"/><p th:text="${#strings.toUpperCase('www.baidu.cn')}"/><p th:text="${#strings.trim('www.baidu.cn')}"/><hr/><p th:text="${#sets.contains(names,'boot-0')}"/><p th:text="${#sets.contains(names,'boot-9')}"/><p th:text="${#sets.size(names)}"/><hr/><p th:text="${#lists.contains(ids,0)}"/>
</body>
Link URL
链接 URL 表达式语法是 @{...}
反斜杠 ”/“ 开头,代表static目录下的静态资源文件
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org/">
<head><meta charset="UTF-8"><title>Title</title><link rel="stylesheet" th:href="@{/bootstrap-3.3.7-dist/css/bootstrap.css}"><script type="text/javascript" th:src="@{/jquery-2.1.4.js}"></script><script type="text/javascript" th:src="@{/mylayer.js}"></script>
</head>
<body><a class="btn btn-primary" href="/">返回首页</a> <br/><a class="btn btn-primary" href="#" th:href="@{/}">返回首页</a> <br/><a href="/student/search">访问StudentController下面的search方法</a> <br/><a href="#" th:href="@{/student/search}">访问StudentController下面的search方法</a><br/><!-- 会生成 url: http://localhost:8888/student/search?id=2&name=zhangsan --><a href="#" th:href="@{/student/search(id=${student.id},name=${student.name})}">访问UrlController下面的demo方法带参数</a>
</body>
</html>
@Controller
@RequestMapping("/student")
public class StudentController {@RequestMapping("/search")public String search(Integer id, String name) {System.out.println("StudentController.search");System.out.println("id: " + id);System.out.println("name: " + name);return "index";}
}
如何引入另一个html页面:
header.html:
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org/">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><div th:fragment="common_resource"><link rel="stylesheet" th:href="@{/bootstrap-3.3.7-dist/css/bootstrap.css}"><script type="text/javascript" th:src="@{/jquery-2.1.4.js}"></script><script type="text/javascript" th:src="@{/mylayer.js}"></script></div>
</body>
</html>
<head><meta charset="UTF-8"><title>Title</title><!--<link rel="stylesheet" th:href="@{/bootstrap-3.3.7-dist/css/bootstrap.css}"><script type="text/javascript" th:src="@{/jquery-2.1.4.js}"></script><script type="text/javascript" th:src="@{/mylayer.js}"></script>--><div th:replace="header::common_resource"></div>
</head>
相关文章:
Thymeleaf简介
在Java中,模板引擎可以帮助生成文本输出。常见的模板引擎包括FreeMarker、Velocity和Thymeleaf等 Thymeleaf是一个适用于Web和独立环境的现代服务器端Java模板引擎。 Thymeleaf 和 JSP比较: Thymeleaf目前所作的工作和JSP有相似之处,Thyme…...
uniapp中uni-easyinput 使用@input 不改变绑定的值
只允许输入数字和字母 使用input 正则replace后赋值给A 遇到问题: 当输入任意连续的非法字符时, 输入框不变. 直到输入一个合法字符非法字符才成功被过滤. <uni-forms-item label"纳税人识别号" name"number"><uni-easyinput v-model"numb…...
前端零基础入门到上班:Day7——表单系统实战全解析
🧩前端零基础入门到上班:Day7——表单系统实战全解析 ✅ 目标:不仅掌握 HTML 表单标签,更深入理解其在实战中的作用、验证方式、美化技巧与 JS 联动,为后续接入 Vue、后端接口打下坚实基础。 🌟 一、HTML 表…...
【特殊场景应对1】视觉设计:信息密度与美学的博弈——让简历在HR视网膜上蹦迪的科学指南
写在最前 作为一个中古程序猿,我有很多自己想做的事情,比如埋头苦干手搓一个低代码数据库设计平台(目前只针对写java的朋友),比如很喜欢帮身边的朋友看看简历,讲讲面试技巧,毕竟工作这么多年,也做到过高管,有很多面人经历,意见还算有用,大家基本都能拿到想要的offe…...
o3和o4-mini的升级有哪些亮点?
ChatGPT是基于OpenAI GPT系列的高性能对话生成AI,经过多代迭代不断提升自然语言理解和生成能力。 在过去的一年中,OpenAI先后发布了GPT-4、GPT‑4.1及多种mini版本,为不同使用场景提供灵活选择。 随着用户需求向更高效、更精准的推理和视觉…...
影楼精修行业浅见-序言
影楼及商业摄影行业对高效、智能化的图像精修需求日益增长。传统修图流程耗时长、人工成本高,且修图师水平参差不齐影响最终成片质量。AI驱动的影像精修软件通过自动化、批量处理和智能算法,显著提升了修片效率和一致性,成为影楼数字化升级的…...
MATLAB 控制系统设计与仿真 - 36
鲁棒工具箱定义了个新的对象类ureal,可以定义在某个区间内可变的变量。 函数的调用格式为: p ureal(name,nominalvalue) % name为变量名,nominalValue为标称值,默认变化值为/-1 p ureal(name,nominalvalue,PlusMinus,plusminus) p ureal(name,nomin…...
Spring数据访问全解析:ORM整合与JDBC高效实践
目录 一、Spring ORM集成深度剖析 🌟 ORM模块架构设计 核心集成特性: 整合MyBatis示例配置: 二、Spring JDBC高效实践指南 🌟 传统JDBC vs Spring JDBC对比 🌟 JdbcTemplate核心操作示例 批量操作优化…...
【HCIA】使用Access port实现简易的VLAN间通信
前言 当我们拥有一台三层交换机与两个vlan,我们可以使用简易的Vlanif配置实现VLAN间通信。 文章目录 前言1. 拓扑图2. 配置交换机3. 配置PC1与PC2的网络4. port link-type后记修改记录 1. 拓扑图 2. 配置交换机 <Huawei>system-view [Huawei]undo info-cent…...
6.VTK 颜色
文章目录 概念RGB示例HSV示例 概念 RGB颜色系统:通过红(R)、绿(G)、蓝(B)三个颜色分量的组合来定义颜色。每个分量的取值范围是0到1,其中(0, 0, 0)代表黑色,而(1, 1, 1)代表白色。可以使用vtkProperty::SetColor(r, g, b)方法为Actor设置颜色…...
shiro使用
shiro是apache提供的一种安全框架。他可以将登录,权限这一方面简单化。 使用shiro需要引入 <dependency><groupId>org.apache.shiro</groupId><artifactId>shiro-core</artifactId><version>1.9.0</version></depend…...
光谱相机的成像方式
光谱相机的成像方式决定了其如何获取物体的空间与光谱信息,核心在于分光技术与扫描模式的结合。以下是主要成像方式的分类解析: 一、滤光片切换型 1. 滤光片轮(Filter Wheel) 原理:通过旋转装有多个窄带…...
浅析MySQL事务锁
在 MySQL 中,事务锁是用于确保数据一致性和并发控制的重要机制。事务锁可以帮助防止多个事务同时修改同一数据,从而避免数据不一致和脏读、不可重复读、幻读等问题。 以下是 MySQL 事务锁的关键点总结: 事务锁:用于确保数据一致性和并发控制。锁的类型: 行级锁:InnoDB,粒…...
算法-链表
小细节 初始化问题 我们这样子new一个ListNode 它里面的默认值是0,所以我们不能这样 如果我们为空,我们要返回null 节点结束条件判断(多创建节点问题) 参考示例3217 解析: 我的答案是多了一个无用节点 这是因为我每…...
ON DUPLICATE KEY UPDATE 更底层解释它的优势
从更底层来看,ON DUPLICATE KEY UPDATE 的优势主要源于以下几个方面: 1. 减少网络往返次数 先查询再更新:这种方式需要客户端和数据库服务器之间进行多次网络通信。首先,客户端发送一个 SELECT 查询请求,然后等待服务…...
3.8/Q1,GBD数据库最新文章解读
文章题目:Regional and National Burden of Traumatic Brain Injury and Spinal Cord Injury in North Africa and Middle East Regions, 1990-2021: A Systematic Analysis for The Global Burden of Disease Study 2021 DOI:10.1007/s44197-025-00372-…...
51单片机实验二:数码管静态显示
目录 一、实验环境与实验器材 二、实验内容及实验步骤 1.单个数码管显示 2.六个数码管依次从0~F变换显示 3.proteus仿真 一、实验环境与实验器材 环境:Keli,STC-ISP烧写软件,Proteus. 器材:TX-1C单片机(STC89C52RC…...
Linux驱动开发进阶(八)- GPIO子系统BSP驱动
文章目录 1、前言2、pinctrl子系统3、pinctrl bsp驱动4、gpio子系统5、gpio bsp驱动 1、前言 学习参考书籍以及本文涉及的示例程序:李山文的《Linux驱动开发进阶》本文属于个人学习后的总结,不太具备教学功能。 2、pinctrl子系统 在讨论gpio子系统时&…...
【Windows】安装或者点击OneDrive没有任何反应的解决方案
一些Windows企业版或者神州网信政府版的策略会禁止使用OneDrive,双击OneDrive安装程序或者点击OneDrive软件会没有任何反应。通过下面的设置可以解除相关的限制。 1、修改注册表 打开注册表管理器。依次HKEYLOCAL_MACHINE\Software\Policies\Microsoft\Windows\One…...
Android tinyalsa库函数剖析
1. PCM 流控制函数 打开、关闭及状态检查 pcm_open(unsigned int card, unsigned int device, unsigned int flags, struct pcm_config *config) 打开指定声卡(card)和设备(device)的 PCM 流。 flags 参数确定流的方向࿱…...
PyCharm Flask 使用 Tailwind CSS v3 配置
安装 Tailwind CSS 步骤 1:初始化项目 在 PyCharm 终端运行:npm init -y安装 Tailwind CSS:npm install -D tailwindcss3 postcss autoprefixer初始化 Tailwind 配置文件:npx tailwindcss init这会生成 tailwind.config.js。 步…...
Python爬虫第17节-动态渲染页面抓取之Selenium使用下篇
目录 引言 一、获取节点信息 1.1 获取属性 1.2 获取文本值 1.3 获取ID、位置、标签名、大小 二、切换Frame 三、延时等待 3.1 隐式等待 3.2 显式等待 四、前进后退 五、Cookies 六、选项卡管理 七、异常处理 引言 这一节我们继续讲解Selenium的使用下篇࿰…...
HarmonyOS 第2章 Ability的开发,鸿蒙HarmonyOS 应用开发入门
第2章 Ability的开发 本章内容 本章介绍HarmonyOS的核心组件Ability的开发。 2.1 Ability概述 2.2 FA模型介绍 2.3 Stage模型介绍 2.4 Ability内页面的跳转和数据传递 2.5 Want概述 2.6 实战:显式Want启动Ability 2.7 实战:隐式Want打开应用管理 2.8 小结 2.9 习题 2.1 Abili…...
day2-小白学习JAVA---java第一个程序
java第一个程序 1、新建一个文件,以.java为结尾2、用编辑器打开后写入代码(本人写前端,所以用vscode,也可用其他)3、编译文件4、运行文件5、HelloWorld代码解释6、文档注释 1、新建一个文件,以.java为结尾 …...
Rockchip 新一代 64 位处理器 RK3562--九鼎开发板
RK3562 是 Rockchip 新一代 64 位处理器 RK3562(Quad-core ARM Cortex-A53,主频 最高 2.0GHz),最大支持 8GB 内存;内置独立的 NPU,可用于轻量级人工智能应用,RK3562 拥有 PCIE2.1/USB3.0 OTG/…...
z-library电子图书馆最新地址的查询方法
对于喜欢读书的伙伴们,应该都听说过z站(z-library),优点多多,缺点就是地址不稳定,经常会变化网站地址。然后我最近发现了一个工具,可以不间断更新官方可用的z站地址:电子书最新地址...
常见MQ及类MQ对比:Redis Stream、Redis Pub/Sub、RocketMQ、Kafka 和 RabbitMQ
常见MQ及类MQ对比 基于Grok调研 Redis Stream、Redis Pub/Sub、RocketMQ、Kafka 和 RabbitMQ 关键点: Redis Pub/Sub 适合简单实时消息,但不持久化,消息可能丢失。Redis Stream 提供持久化,适合需要消息历史的场景,但…...
Kaggle-Bag of Words Meets Bags of Popcorn-(二分类+NLP+Bert模型)
Bag of Words Meets Bags of Popcorn 题意: 有很多条电影评论记录,问你每一条记录是积极性的评论还是消极性的评论。 数据处理: 1.首先这是文件是zip形式,要先解压,注意sep ‘\t’。 2.加载预训练的 BERT 分词器 …...
Spring Boot 3 + SpringDoc:打造接口文档
1、背景公司 新项目使用SpringBoot3.0以上构建,其中需要对外输出接口文档。接口文档一方面给到前端调试,另一方面给到测试使用。 2、SpringDoc 是什么? SpringDoc 是一个基于 Spring Boot 项目的库,能够自动根据项目中的配置、…...
Json 在线格式化 - 加菲工具
Json 在线格式化 打开网站 加菲工具 选择“Json 在线格式化” 或者直接进入 https://www.orcc.top/tools/json 输入Json,点击左上角的“格式化”按钮 得到格式化后的结果...
