一、基础准备引入 Thymeleaf在 HTML 页面的html标签中添加命名空间让 IDE 识别 Thymeleaf 语法并提供提示html langzh-CN xmlns:thhttp://www.thymeleaf.org核心依赖Maven若使用 Spring Boot只需引入 starter 依赖即可xmldependency groupIdorg.springframework.boot/groupId artifactIdspring-boot-starter-thymeleaf/artifactId /dependency二、核心语法分类1. 变量表达式${}作用获取后端传递到页面的变量值是最常用的语法。语法th:text${变量名}示例后端ControllerGetMapping(/user) public String getUser(Model model) { User user new User(张三, 20); model.addAttribute(user, user); model.addAttribute(msg, 欢迎使用Thymeleaf); return user; }前端页面html预览!-- 直接输出普通变量 -- div th:text${msg}默认显示内容/div !-- 输出对象属性支持点语法/方括号语法 -- div th:text${user.name}默认姓名/div div th:text${user[age]}默认年龄/div说明th:text会替换标签内的文本内容若变量为 null标签内默认内容会显示开发时可用于占位。2. 选择变量表达式*{}作用基于已选择的对象th:object简化属性访问避免重复写对象名。语法先通过th:object指定对象再用*{}访问属性。示例div th:object${user} p th:text*{name}姓名/p p th:text*{age}年龄/p /div等价写法*{name}等价于${user.name}适合对象属性较多的场景。3. 消息表达式#{}作用读取国际化配置文件.properties中的文本实现多语言。语法th:text#{配置项key}示例国际化文件messages_zh_CN.propertiespropertieswelcome欢迎访问 user.name用户名页面使用div th:text#{welcome}默认欢迎语/div label th:text#{user.name}姓名/label4. 链接表达式{/}作用生成绝对路径 / 相对路径自动拼接上下文路径避免硬编码。语法无参数th:href{/路径}带参数th:href{/路径(参数1值1,参数2值2)}示例!-- 普通链接 -- a th:href{/home}首页/a !-- 带参数链接 -- a th:href{/user/detail(id1,typenormal)}用户详情/a !-- 静态资源CSS/JS -- link th:href{/css/style.css} relstylesheet script th:src{/js/index.js}/script5. 片段表达式~{}作用复用页面片段如页眉、页脚、侧边栏减少代码冗余。核心标签th:fragment定义片段th:insert/th:replace/th:include引入片段三者区别见下表标签作用特点th:insert插入片段到当前标签内保留当前标签片段作为子元素th:replace用片段替换当前标签不保留当前标签直接替换th:include插入片段的内容到当前标签仅保留片段文本已过时示例定义片段fragments/header.htmldiv th:fragmentheader h1网站头部/h1 nav导航栏/nav /div引入片段!-- 插入片段保留当前div标签 -- div th:insert~{fragments/header :: header}/div !-- 替换片段当前div被片段替换 -- div th:replace~{fragments/header :: header}/div !-- 简写省略~{} -- div th:replacefragments/header :: header/div三、常用属性1. 文本操作属性作用示例th:text替换标签内文本转义 HTMLp th:text${msg}默认值/pth:utext替换标签内文本不转义 HTMLp th:utext${htmlMsg}默认值/p2. 条件判断th:if条件为 true 时显示标签th:unless条件为 false 时显示标签与 th:if 相反th:switch/th:case多分支判断类似 Java 的 switch示例html预览!-- 简单条件 -- div th:if${user.age 18}成年/div div th:unless${user.age 18}未成年/div !-- 多分支 -- div th:switch${user.type} p th:case1普通用户/p p th:case2VIP用户/p p th:case*未知用户/p !-- 默认分支 -- /div3. 循环遍历th:each遍历集合List/Map/ 数组语法th:each元素, 状态变量 : ${集合}状态变量常用属性index索引从 0 开始count计数从 1 开始size集合大小even/odd是否偶数 / 奇数行first/last是否第一个 / 最后一个元素示例!-- 遍历List -- ul li th:eachu, stat : ${userList} th:text${u.name} - stat.count th:class${stat.odd} ? odd-row : even-row 默认内容 /li /ul !-- 遍历Map -- div th:eachentry : ${map} 键span th:text${entry.key}/span 值span th:text${entry.value}/span /div4. 动态属性th:attr设置任意 HTML 属性简写属性更常用th:id/th:class/th:src/th:href/th:value等示例!-- 动态设置id和class -- div th:iduser- ${user.id} th:class${user.status} ? active : disable/div !-- 动态设置输入框值 -- input typetext th:value${user.name} !-- 动态设置checked -- input typecheckbox th:checked${user.agree}5. 内联表达式作用在 HTML 文本 / JS 中直接使用 Thymeleaf 表达式无需标签属性。语法文本内联[[${变量}]]转义 HTML、[(${变量})]不转义 HTMLJS 内联在script标签中加th:inlinejavascript然后用/*[[${变量}]]*/示例!-- 文本内联 -- pHello, [[${user.name}]]!/p !-- JS内联 -- script th:inlinejavascript var userName /*[[${user.name}]]*/ 默认值; var userAge /*[[${user.age}]]*/ 0; console.log(userName, userAge); /script四、常用工具类Thymeleaf 提供内置工具类可通过#工具类名调用方法常用如下工具类作用示例#strings字符串操作${#strings.isEmpty(msg)}、${#strings.toUpperCase(name)}#numbers数字格式化${#numbers.formatDecimal(price, 0, 2)}保留 2 位小数#dates日期格式化${#dates.format(createTime, yyyy-MM-dd HH:mm:ss)}#lists集合操作${#lists.isEmpty(userList)}、${#lists.size(userList)}#objects对象判断${#objects.nullSafe(user.age, 0)}null 时返回默认值 0示例!-- 字符串非空判断 -- div th:if${#strings.isNotEmpty(msg)} 消息span th:text${msg}/span /div !-- 日期格式化 -- div th:text${#dates.format(user.createTime, yyyy-MM-dd)}/div !-- 数字保留2位小数 -- div th:text${#numbers.formatDecimal(user.balance, 0, 2)}/div总结核心表达式${}变量、*{}选择变量、#{}国际化、{}链接、~{}片段是 Thymeleaf 最基础也是最核心的语法需熟练掌握。常用功能条件判断th:if/th:switch、循环遍历th:each、动态属性th:class/th:value是页面开发中高频使用的功能结合工具类可提升开发效率。代码复用通过th:fragmentth:insert/replace实现页面片段复用是减少冗余代码的关键技巧。