Thymeleaf 的 th:* 属性之—— th: ->text

本贴最后更新于 2238 天前,其中的信息可能已经天翻地覆

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=@{/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:text attribute, 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 the th:text attribute should be the message with the home.welcome key 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>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}">Welcome to our grocery store!</p>

等效于 html:

Welcome to our fantastic grocery store!

3.3 th:href

@{xxx} :链接 url 的表达式

<a href="details.html" th:href="@{/order/details(orderId=${o.id})}">view</a>

转载自:https://www.cnblogs.com/zjfjava/p/6893486.html

  • Java

    Java 是一种可以撰写跨平台应用软件的面向对象的程序设计语言,是由 Sun Microsystems 公司于 1995 年 5 月推出的。Java 技术具有卓越的通用性、高效性、平台移植性和安全性。

    3187 引用 • 8213 回帖

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...