https://blog.csdn.net/xxb5502296/article/details/78319898(挺全的)

https://blog.csdn.net/qq_43279637/article/details/86406836

http://www.cnblogs.com/vinphy/p/4674247.html

https://blog.csdn.net/qwlzxx/article/details/70976509

th:text把表达式对应的值代替标签内的文本。(<p th:text="#{home.welcome}">welcome</p>)

th:utext显示非转义文本。(自动解析文本中的html标签并渲染页面)

th:object在父标签选择对象,子标签使用*{…}选择表达式选取值。没有选择对象,那子标签使用选择表达式和${…}变量表达式是一样的效果。同时即使选择了对象,子标签仍然可以使用变量表达式。

  1. <div th:object="${session.user}" >
  2. <p th:text="*{fisrtName}">firstname</p>
  3. <p th:text="${session.user.lastName}">lastname</p>
  4. </div>

th:href修改a标签的href属性,使用@{…}URL表达式展示路径。URL参数也可以被写进表达式。

  <a href="list.html" th:href="@{/users/list(id=${o.id},name=${o.name})}">查询</a>

th:with在当前标签范围内,创建一个本地变量(local variable),并添加到上下文的变量map。

  1. <div th:with="name=${user.name},nickname=${name}+'用户'">...

th:attr设置或者修改标签属性(不推荐),推荐使用th:value、th:action、th:class,相当于th:attr=”value=…”、th:attr=”action=…”等等。

  1. <input type="submit" value="submit" th:attr="value=#{submit.text}" />

th:classappend、th:styleappend、th:attrappend、th:attrprepend属性前或者后添加属性值。

  1. <tr class="r" th:attrappend="class=' odd'">
  2. <tr class="r" th:classapend="'odd'">

th:checked、th:disabled、th:selected根据判断条件结果来决定是否给该checked等属性设定固定值。

  1. <input type="checkbox" th:checked="${user.active}"/>

th:assert断言,支持逗号分隔的多条件。

  1. <div th:assert="${var1},${var2}==2,#lists.isEmpty(${list})">

th:remove被处理时会被删除,支持参数all,tag,body,all-but-first,none。顾名思义,举例all-but-first应用场景。

  1. <tbody th:remove="all-but-first">
  2. <tr th:each="prod:${prods}">...</tr>
  3. <tr><td>示例数据</td></tr>
  4. </tbody>

th:if判断是否需要展示此标签,当null、0、’0’、’false’、’off’、’no’时为false,否则为true。

  1. <div th:if="${user.isAdmin()}">...

th:unless与th:if相反

th:switch、th:case同java中的switch、case用法

  1. <div th:switch="${user.role}">
  2. <p th:case="'admin'">administrator</p>
  3. <p th:case="*">other</p>
  4. </div>

th:each迭代,支持Iterable、Map(迭代局部变量为Map.Entry)、数组、包含对象本身的单值对象。

  1. <tr th:each="prod : ${prods}">
  2. <td th:text="${prod.name}">..</td>
  3. </tr>

${prods}是迭代变量,prod是本地变量(local variable),上例中在tr范围内有效。 
th:each迭代状态变量,支持获取参数如index、count、size、current、even/odd、fisrt、last。

  1. <tr th:each="prod,iterStat : ${prods}" th:class="${iterStat.odd}?'odd'">
  2. <td th:text="${iterStat.current.name}">...</td>
  3. </tr>

隐式支持迭代局部变量+Stat作为本地变量,上例中不声明iterStat可直接使用prodStat。

th:fragment、th:include、th:replace引入或替换模板内容,支持引入其他模板文件的部分templatename::domselector(支持XPath语法或者css选择器)、templatename::fragmentname,也支持引入整个模板templatename或者本模板内的部分::domselector

  1. <div th:include="footer::#{footer.admin}">
  2. ----------分割线----------
  3. <div th:fragment="#{footer.admin}">
  4. copyright 2017
  5. </div>

th:replace不同于th:include,它将引用模板的整个dom替换当前dom。th:include是将引用模板的dom下子元素引入到当前dom内。

fragment可引入类函数机制,同时函数参数可以不声明即使用。

  1. <div th:fragment="frag(var1,var2)">
  2. <div th:include="::flag(var1=${var1},var2=${var2})">

th:block作为属性容器,处理属性时会消失。

  1. <table>
  2. <th:block th:each="r:${rs}">
  3. <tr><td th:text="${r.name}">1</td></tr>
  4. </th:block>
  5. </table>

th:inline内联,即把表达式直接写进html文本而不是属性,支持模式text、javascript、none。

  1. <!-- 同 <p th:text="'hello,'+${session.user.name}+'!'">abc</p> -->
  2. <p th:inline="text">hello,[[${session.user.name}]]!</p>
  3. <!-- 利用javascript注释/*..*/,保证静态或被thymeleaf处理后都能正确展示页面 -->
  4. <script th:inline="javascript">
  5. var user = /*[[${session.user}]]*/ null;
  6. </script>

data-{prefix}-{name}对html5更友好的语法,等同于{prefix}:{name}

  1. <td data-th-text="${user.name}">...</td>

th:field作用于input、select、textarea,th:field和th:object联用,

  1. <input type="text" th:field="*{date1}" />——id、name为date1,value绑定date1属性值
  2. <ul>
  3. <li th:each="feat: ${allFeats}">
  4. <input type="checkbox" th:field="*{feats}" th:value="${feat}">——id为feats1类推,name为feats,value为当前遍历feat的值。feats属性的值所在input会加上checked属性。
  5. <lable th:for="${#ids.prev('feats')}"——forfeats字段当前遍历序列中最后一个id
  6. th:text="#{${'feature.'+feat}}">abc</label>
  7. </li>
  8. </ul>
  9. <select th:field="*{type}">
  10. <option th:each="type:${types}"
  11. th:value="${type}"
  12. th:text="#${'type.'+type}}">选项</option>
  13. </select>
  1.  
  1.  
  1.  
  1.  

th:标签的更多相关文章

  1. a标签点击跳转失效--IE6、7的奇葩bug

    一般运用a标签包含img去实现点击图片跳转的功能,这是前端经常要用到的东西. 今天遇到个神奇的bug:如果在img上再包裹一层div,而且div设置了width和height,则图片区域点击时,无任何 ...

  2. IE6、7下html标签间存在空白符,导致渲染后占用多余空白位置的原因及解决方法

    直接上图:原因:该div包含的内容是靠后台进行print操作,输出的.如果没有输出任何内容,浏览器会默认给该空白区域添加空白符.在IE6.7下,浏览器解析渲染时,会认为空白符也是占位置的,默认其具有字 ...

  3. 百度MIP页规范详解 —— canonical标签

    百度MIP的规范要求必须添加强制性标签canonical,不然MIP校验工具会报错: 强制性标签<link rel="/^(canonical)$/"> 缺失或错误 这 ...

  4. 【CSS进阶】伪元素的妙用--单标签之美

    最近在研读 <CSS SECRET>(CSS揭秘)这本大作,对 CSS 有了更深层次的理解,折腾了下面这个项目: CSS3奇思妙想 -- Demo (请用 Chrome 浏览器打开,非常值 ...

  5. TODO:Laravel 使用blade标签布局页面

    TODO:Laravel 使用blade标签布局页面 本文主要介绍Laravel的标签使用,统一布局页面.主要用到到标签有@yield,@ stack,@extends,@section,@stop, ...

  6. 最新 去掉 Chrome 新标签页的8个缩略图

    chrome的新标签页的8个缩略图实在让人不爽,网上找了一些去掉这个略缩图的方法,其中很多已经失效.不过其中一个插件虽然按照原来的方法已经不能用了,但是稍微变通一下仍然是可以用的(本方法于2017.1 ...

  7. css-父标签中的子标签默认位置

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  8. xpath提取多个标签下的text

    title: xpath提取多个标签下的text author: 青南 date: 2015-01-17 16:01:07 categories: [Python] tags: [xpath,Pyth ...

  9. 多个Img标签之间的间隙处理方法

    1.多个标签写在一行 <img src="/i/eg_tulip.jpg" alt="郁金香" height="100px"/> ...

  10. html5标签canvas函数drawImage使用方法

    html5中标签canvas,函数drawImage(): 使用drawImage()方法绘制图像.绘图环境提供了该方法的三个不同版本.参数传递三种形式: drawImage(image,x,y):在 ...

随机推荐

  1. JavaSE 集合类HashSet保证自定义对象唯一性

    首先我们自定义Person类,只有姓名和年龄两个属性 class Person{ private String name ; private int age ; public Person(Strin ...

  2. JavaScript RegExp(正则)

    第一种方式是直接通过/正则表达式/写出来,第二种方式是通过new RegExp('正则表达式')创建一个RegExp对象. 两种写法是一样的: var re1 = /ABC\-001/; var re ...

  3. MySql添加远程超级管理员用户

    可以通过发出GRANT语句增加新用户:首先在数据库本机上用ROOT用户登录上MySql,然后运行命令: mysql>GRANT ALL PRIVILEGES ON *.* TO admin'@' ...

  4. String常用类

    一.String类String类在java.lang包中,java使用String类创建一个字符串变量,字符串变量属于对象.java把String类声明的final类,不能有类.String类对象创建 ...

  5. Linux环境(Centos7)下部署.NetCore2.0的Web应用

    Web应用基于Windows环境下开发,然后部署到Linux 1.进入VS2017,点击新建->项目->.NetCore->ASP.NET Core Web应用程序,确定 2.选择W ...

  6. (PMP)第4章-----项目整合管理

    4.1 制定项目章程 输入 工具与技术 输出 1.商业文件 (商业论证,效益管理计划) 1.专家判断 1.项目章程 2.协议 2.数据收集 (头脑风暴,焦点小组,访谈) 2.假设日志 3.事业环境因素 ...

  7. 线程中的join方法

    join方法的作用是同步线程. 1.不使用join方法:当设置多个线程时,在一般情况下(无守护线程,setDeamon=False),多个线程同时启动,主线程执行完,会等待其他子线程执行完,程序才会退 ...

  8. 未能加载文件或程序集“ .....WebUI ”或它的某一个依赖项,试图加载格式不正确的程序

    编译Web网站没有问题(需要引用oracle.dataAccess.dll),在运行时报错如下: 解决: 1. 将项目编译生成x86模式(win7 64位) 2. 有可能本机运行有问题,发布到IIS, ...

  9. 利用Python+163邮箱授权码发送邮件

    背景 前段时间写了个自动打卡的脚本,但是脚本不够完善,我需要知道,打卡到底成没成功,因此,我想到了用Python执行完代码之后,再执行一段发送邮件的代码.需求开始明确了,就开始分析和写代码实现吧. 分 ...

  10. jenkins as code 与go语言学习

    前言 最近看jenkins as code这个概念在很多文章中提起,持续交付中八大原则也有把一切都放入版本管理,最近准备把我们公司用的一些jenkins上的job的配置也放到git中,由于https: ...