Thymeleaf 常用th标签

最新推荐文章于 2024-07-26 23:24:41 发布

辉~情

最新推荐文章于 2024-07-26 23:24:41 发布

阅读量383

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/bigtree_/article/details/99300227

本文详细介绍了Thymeleaf模板引擎的使用方法，包括如何在页面中引入Thymeleaf标签库、css和js资源，以及常用标签的解释。通过实例展示了变量表达式、选择表达式、消息文字表达式和链接url表达式的应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

引入文件

//页面引入 Thymeleaf标签库
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
//引入css
<link th:href="@{/common/bootstrap/css/bootstrap.css}" rel="stylesheet"/>
//引入js
<script th:src="@{/common/bootstrap/js/bootstrap.js}"></script>

常用标签

th简单表达式

 // 一：${...}  变量表达式：
	<input type="text" name="userName" value="Beyrl" th:value="${user.name}" />
　　//上述代码为引用user对象的name属性值。
　　　　
// 二：    *{...}  选择表达式:
<div th:object="${session.user}">                                                                       
     <p>Nationality: <span th:text="*{nationality}">XXXX</span>.</p>    
</div>
 　　// 选择表达式一般跟在th:object后，直接选择object中的属性。

// 三：  #{...}  消息文字表达式：
<p th:utext="#{home.welcome}">Welcome to our grocery store!</p>

// 四： @{...}  链接url表达式：
<a href="details.html" th:href="@{/webPage/details(orderId=${o.id})}">view</a>
　　　//@{……}支持决定路径和相对路径。其中相对路径又支持跨上下文调用url和协议的引用（//code.jquery.com/jquery-2.0.3.min.js）。
　　　//当URL为后台传出的参数时，代码如下：
	<img src="../../webPage/food/images/pizza.jpg" th:src="@{${path}}" alt="披萨" />

标签表

参考博客

原文地址（这里参照编写）：https://www.cnblogs.com/beyrl-blog/p/6633182.html
参考文档：https://blog.youkuaiyun.com/fulq1234/article/details/85003273
https://blog.youkuaiyun.com/malimingwq/article/details/79329921
https://blog.youkuaiyun.com/chs007chs/article/details/81354576
https://www.cnblogs.com/ityouknow/p/5833560.html
演示代码：https://blog.youkuaiyun.com/chengqiuming/article/details/83957279