首页 > 代码库 > （五）Themeleaf的 th:* 属性之—— th: ->text& utext& href
（五）Themeleaf的 th:* 属性之—— th: ->text& utext& href
th:*使用原因：
- for the sake of simplicity and compactness of the code samples（简化代码）
- the
th:*notation is more general and allowed in every Thymeleaf template mode (XML,TEXT…)（th:*在多个模板模式里更为通用且允许）
常用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"> 1.all:删除包含标签和所有的孩子。 2.body:不包含标记删除,但删除其所有的孩子。 3.tag:包含标记的删除,但不删除它的孩子。 4.all-but-first:删除所有包含标签的孩子,除了第一个。 5.none:什么也不做。这个值是有用的动态评估。th:attr 设置标签属性，多个属性可以用逗号分隔 比如 th:attr="src=http://www.mamicode.com/@{/image/aa.jpg},title=#{logo}"，此标签不太优雅，一般用的比较少。
3.1 th:text
可对表达式或变量求值，并将结果显示在其被包含的 html 标签体内替换原有html文本。
文本链接: 用 "+" 符号，若是变量表达式也可以用“|”符号
eg.
<p th:text="#{home.welcome}">Welcome to our grocery store!</p>
equals.(局限：只能在html5中使用)
<p data-th-text="#{home.welcome}">Welcome to our grocery store!</p>
- The
th:textattribute, which evaluates its value expression and sets the result as the body of the host tag, effectively replacing the “Welcome to our grocery store!” text we see in the code.（th：text属性，他声明设置表达式的值，并使表达式返回的值来填充标签内容，替换或设置标签内部的内容，当前例子中即替换“欢迎光临本店”这些字。） - The
#{home.welcome}expression, specified in the Standard Expression Syntax, instructing that the text to be used by theth:textattribute should be the message with thehome.welcomekey corresponding to whichever locale we are processing the template with.（#{home.welcome}表达式，一个标准的表达式语法，指出在模板中，th:text属性所对应Message的key，即使用home.welcome对应的value替换现有内容。）
3.2 th:utext（非转义文本：unes??caped text）
e.g.（想要输出转义字符效果）
home.welcome=Welcome to our <b>fantastic</b> grocery store!
执行此模板，默认使用<p th:text="#{home.welcome}"></p>来解析，结果为：
<p>Welcome to our <b>fantastic</b> grocery store!</p>
解决方案：（This is the default behaviour of the
th:text attribute. If we want Thymeleaf to respect our HTML tags and not escape them, we will have to use a different attribute: th:utext (for “unescaped text”):）使用<p th:utext="#{home.welcome}"></p>即可。
<p th:utext="#{home.welcome}">Welcome to our grocery store!</p>
等效于html：
<p>Welcome to our <b>fantastic</b> grocery store!</p>
3.3 th:href
@{xxx} ：链接url的表达式
<a href="details.html" th:href="@{/order/details(orderId=${o.id})}">view</a>
（五）Themeleaf的 th:* 属性之—— th: ->text& utext& href
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。