Thymeleaf 简介、教程

前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。点击跳转到教程。

Thymeleaf是一个适用于Web和独立环境的现代服务器端Java模板引擎。

Thymeleaf的主要目标是为您的开发工作流程带来优雅的自然模板 - 可以在浏览器中正确显示的HTML,也可以用作静态原型,从而在开发团队中实现更强大的协作。

通过Spring Framework模块,与您喜欢的工具的大量集成,以及插入您自己的功能的能力,Thymeleaf是现代HTML5 JVM Web开发的理想选择 - 尽管它可以做得更多。

以上转自其官网:Thymeleaf  

以下转自:https://www.yiibai.com/thymeleaf/thymeleaf-instroduce.html

有Thymeleaf 的教程:

Thymeleaf能够处理HTML,XML,JavaScript,CSS甚至纯文本。

Thymeleaf的主要目标是提供一个优雅和高度可维护的创建模板的方式。 为了实现这一点,它建立在自然模板的概念之上,以不影响模板作为设计原型的方式将其逻辑注入到模板文件中。 这改善了设计沟通,弥合了前端设计和开发人员之间的理解偏差。

Thymeleaf也是从一开始就设计(特别是HTML5)允许创建完全验证的模板。

Thymeleaf可以处理什么样的模板?

开箱即用,Thymeleaf可以处理六种模板,每种模板都称为模板模式:

  • HTML
  • XML
  • TEXT
  • JAVASCRIPT
  • CSS
  • RAW

有两种标记模板模式(HTML和XML),三种文本模板模式(TEXT,JAVASCRIPT和CSS)和一种无操作模板模式(RAW)。

HTML模板模式将允许任何类型的HTML输入,包括HTML5,HTML4和XHTML。 将不会执行验证或格式检查,并且在输出中尽可能地遵守模板代码/结构。

XML模板模式将允许XML输入。 在这种情况下,代码应该是格式良好的 - 没有未封闭的标签,没有未加引号的属性等等,如果发现格式错误,解析器将会抛出异常。 请注意,将不会执行验证(针对DTD或XML模式)。

TEXT模板模式将允许对非标记性质的模板使用特殊语法。 这种模板的例子可能是文本电子邮件或模板文档。 请注意,HTML或XML模板也可以作为TEXT处理,在这种情况下,它们不会被解析为标记,而每个标记,DOCTYPE,注释等都将被视为纯文本。

JAVASCRIPT模板模式将允许处理Thymeleaf应用程序中的JavaScript文件。这意味着能够像在HTML文件中一样使用JavaScript文件中的模型数据,但是使用特定于JavaScript的集成(例如专门转义或自然脚本)。 JAVASCRIPT模板模式被认为是文本模式,因此使用与TEXT模板模式相同的特殊语法。

CSS模板模式将允许处理Thymeleaf应用程序中涉及的CSS文件。类似于JAVASCRIPT模式,CSS模板模式也是文本模式,并使用TEXT模板模式中的特殊处理语法。

RAW模板模式根本不会处理模板。它意味着用于将未触及的资源(文件,URL响应等)插入正在处理的模板中。例如,可以将HTML格式的外部非受控资源包含在应用程序模板中,从而安全地知道这些资源可能包含的任何Thymeleaf代码都不会被执行。

方言:标准方言

Thymeleaf是一个非常容易扩展的模板引擎(事实上,它可以被称为模板引擎框架),允许您定义和定制模板将被处理到一个很好的细节水平的方式。

一个将某些逻辑应用于标记工件(标签,一些文本,注释或者仅仅是模板不是标记的占位符)的对象被称为处理器,而这些处理器的集合(可能还有一些额外的工件)是方言组成。 开箱即用,Thymeleaf的核心库提供了一种称为“标准方言”的方言,对大多数用户来说应该是足够的。

本教程涵盖了标准方言。 您将在后面的页面中了解的每个属性和语法功能均由该方言定义,即使未明确提及。

当然,如果用户想利用库的高级功能定义自己的处理逻辑,用户可以创建自己的方言(甚至扩展标准方言)。Thymeleaf也可以配置为一次使用几种方言。

标准方言的大多数处理器是属性处理器。 这允许浏览器甚至在被处理之前正确显示HTML模板文件,因为它们将简单地忽略附加属性。 例如,虽然使用标记库的JSP可能包含不能直接由浏览器显示的代码片段,例如:

<form:inputText name="userName" value="${user.name}" />

HTML

Thymeleaf标准方言将允许实现相同的功能:

<input type="text" name="userName" value="Yiibai" th:value="${user.name}" />

HTML

这不仅可以被浏览器正确显示,而且还允许(可选地)在浏览器中静态打开原型时指定一个值属性(本例中为“Yiibai”),在处理模板期间被${user.name}的评估结果值所取代。

这有助于设计人员和开发人员使用完全相同的模板文件,并减少将静态原型转换为工作模板文件所需的工作量。 这样做的能力是一个称为自然模板的功能。

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/447914.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

HDU 6682 Make Rounddog Happy

题意&#xff1a;给你一个集合&#xff0c;求它的所有子集的子集和中数字4出现了多少次 例如 4 4 4 44 44 中4(1)&#xff0c;4(2)&#xff0c;44(3)&#xff0c;44(4)&#xff0c;48(1,3)&#xff0c;48(1,4)&#xff0c;48(2,3)&#xff0c;48(2,4)&#xff0c;总共有10个数字…

如期而至,GCC 4.9.0正式版发布!

摘要&#xff1a;GCC是一套由GNU开发的编程语言编译器。近日&#xff0c;GCC 4.9.0发布&#xff0c;主要新特性包括&#xff1a;提升了C11和C14特性&#xff1b;诊断信息支持彩色显示&#xff1b;移除mudflap运行时检查器等。 如期而至&#xff0c;GCC 4.9.0发布&#xff0c;该…

2.9 go mod 之本地仓库搭建

wikihttps://github.com/golang/go/wiki/Modules#how-to-prepare-for-a-release参考https://blog.csdn.net/benben_2015/article/details/82227338 go mod 之本地仓库搭建----------------------------------------------------------------------------------------将当前项目…

《 追风筝的人 》:“ 为你,千千万万遍 ” ...

前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到教程。 刚来研发中心的时候&#xff0c;在我的新位置上发现了一本书&#xff0c;问后得知是前同事留下的&#xff0c;已无主 。 我就收下了。一…

机器学习入门阶段程序员易犯的5个错误

本文由 伯乐在线 - toolate 翻译自 machine learning mastery。欢迎加入 技术翻译小组。转载请参见文章末尾处的要求。怎样进入机器学习领域没有定式。我们的学习方式都有些许不同&#xff0c;学习的目标也因人而异。 但一个共同的目标就是要能尽快上手。如果这也是你的目标&…

解决: Vue 项目本地运行 run 与服务器上 build 样式不一致,build 后样式不生效

前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到教程。 PS&#xff1a;本人遇到这个问题是用文中最后一句话解决&#xff1a;" 在组件的样式中记得添加 scoped "。 在Vue项目开发过程…

【付出总有回报】广州广汕公路科目三路考通过!小结供大家参考

首先&#xff0c;我的路考小结只供大家参考&#xff0c;大家觉得能用就当提个醒&#xff0c;不能用就权当顶贴积分捧人场啦哈哈祝各位都能顺利过关&#xff01;考前心里和技术准备&#xff1a;我是13年6月底才考完科目二“五项必考”。7月8日才考完长途&#xff0c;可这时候我的…

解决:vue 用 axios 发送请求,每次都会发送两次请求

前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到教程。 我的解决方法是后端加一个过滤器&#xff1a; package gentle.filter;import javax.servlet.*; import javax.servlet.annotation.WebF…

广州科目三考试 不得不看的十条提醒(图)

导读&#xff1a; 考试科目三时考试常会有点小紧张。经常会有考生因为紧张犯了些小错误而被pass掉。如何来应对呢&#xff1f;首先是放松心态&#xff0c;这点其实大家都明白&#xff0c;只是做不到。有人一到考试的时候就紧张&#xff0c;完全思维混乱&#xff0c;动作僵硬。建…

HDU 6706 huntian oy

题意 求以下式子的值&#xff0c;T组数据各个字母满足1 ≤ n , a , b ≤109 &#xff0c;a,b互质 思路&#xff1a; 卡常毒瘤题&#xff0c;出题人时限卡的非常紧&#xff0c;考场上推出来又T又WA 1 #include<bits/stdc.h>2 using namespace std;3 typedef long long ll;…

linux 查看空间(内存、磁盘、文件目录、分区)的几个命令

前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到教程。 1. free free命令用于显示内存状态。 free指令会显示内存的使用情况&#xff0c;包括实体内存&#xff0c;虚拟的交换文件内存&#x…

Ubuntu安装LNMP

安装Nginx使用 apt-get install nginx 就能自动安装 Nginx。 为了确保获得最新的Nginx&#xff0c;可以先使用 apt-get update 命令更新源列表。 安装好之后&#xff0c;使用 dpkg -S nginx 命令来搜索 nginx相关文件。 可以从命令显示结果看出 Nginx默认的安装位置是/etc/ngin…

广州学车科目三路考操作步骤要领

广州学车&#xff0c;科目三路考操作步骤是关键&#xff0c;许多朋友明明会开车&#xff0c;却因为一些步骤上的小疏忽而不得到不补考&#xff0c;今天总结出这个广州学车科目三路考操作步骤要领&#xff0c;希望对大家有帮助&#xff1a; 广州学车&#xff0c;科目三路考操作步…

如何和何时使用 CSS 的权重设置 !important (建议:永不使用!)

前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到教程。 特别声明&#xff1a;此篇文章由David根据Louis Lazaris的英文文章原名《!important CSS Declarations: How and When to Use Them》进行…

独立组件开发打包

组件单独打包 先在src下面新建hymenucsg.js文件 然后在build下的webpack.base.conf.dist.js里面 设置入口文件hymenucsg: ./src/hymenucsg.js,//csg 最后运行打包命令&#xff1a;npm run dist:dev 之后会在dist下面生成组件的js和css文件 使用&#xff1a; html中引入js和css …

广州科目三电子考需注意哪些问题?

广州驾考科目三从4月1日起开始试行电子评判与人工评判相结合的新制度&#xff0c;即电子路考&#xff0c;多数学员对新制度表示不适应&#xff0c;那么&#xff0c;科目三电子路考需要注意哪些问题? 从4月1日开始&#xff0c;科目三考试将试行计算机辅助与人工评判相结合的制度…

解决 VUE: 本地运行和服务器上运行样式不一致,run、build 运行时样式有出入

前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到教程。 1. 我的情况&#xff1a; 我遇到 2 种情况&#xff0c;一个是表格的分页样式有变化。另一个是导航菜单样式有变化。 2. 解决&#xff…

Ubuntu链接服务器

本篇文章介绍&#xff0c;如何在Ubuntu系统下连接远程Ubuntu系统并传输文件。 一. 连接远程Ubuntu服务器。 1. 打开命令行&#xff0c;输入 : sudo apt-get update &#xff0c; 对系统进行更新。 2. 安装 OpenSSH Server&#xff0c;输入 &#xff1a; sudo apt-get install …

开发中的“软”与“硬”:高画质移动游戏开发之道

摘要&#xff1a;游戏的效果不仅与游戏引擎的渲染相关&#xff0c;与硬件优化也有千丝万缕的联系。一款基于芯片优化的移动游戏界面&#xff0c;甚至可以堪比视频游戏的视觉效果。高通半导体事业部资深经理刘晓光从软硬件两个层面分享了移动游戏开发之道。 在今年的Unity亚洲开…

解决 VUE: [Vue warn]: Do not use built-in or reserved HTML elements as component id: xx

前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到教程。 1. 新增一个组件&#xff0c;运行无问题&#xff0c;但F12报错&#xff1a; vue.esm.js?efeb:591 [Vue warn]: Do not use built-in o…