当前位置： 首页 > news >正文

三、thymeleaf基本语法

news 文章来源：https://blog.csdn.net/ouyangqing/article/details/133563512 2025/1/10 10:01:43

3.1、基本语法

3.1.1变量表达式：${...}

变量表达式用于在页面中输出指定的内容，此内容可以是变量，可以是集合的元素，也可以是对象的属性。主要用于填充标签的属性值，标签内的文本，以及页面中js变量的值等。

1、显示文本内容

把变量表达式放在一对嵌套的中括号中“[[]]”，可以用于输出标签之间的文本，也可用于给js变量赋一个静态的值。

如果文本是一段HTML标签，在页面输出时会进行转义，并不会添加成子标签。

示例

在TestServlet的doPost方法的request对象中添加两个字符串属性“title”和“msg”，其中“msg”是一个标签的脚本。

request.setAttribute("title", "这是一个字符串");
request.setAttribute("msg", "
这是一个字符串
");

在index.html中输出此属性的值

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>[[${title}]]</title>
</head>
<body>	 
<div>[[${msg}]]</div>	 	<script type="text/javascript">	alert('[[${title}]]')	</script></body></html>

运行test.do，页面会输了此属性的值

点击“对话框”的"确定"后在页面显示的是转义后的内容。

如果需要加载为HTML标签，可以使用[()]

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"><title>[[${title}]]</title>
</head>
<body><div>[(${msg})]</div>	</body>
</html>

运行test.do，页面会输了此属性的值

2、标签属性值的赋值

要在标签属性上使用表达式，属性名前必须使用"th:"标识。thymeleaf几乎对所有的标签属性都进行了重定义，使每个属性都可以使用"th:"标签来进行动态赋值。

示例

在testServlet的情况中增加一个属性，用于设置字体的颜色

request.setAttribute("color", "color:red;");

在test.html中添加一个div标签，标签上添加"th:style"和“th:utext”属性。注意属性“th:utext”和“th:text”的区别，“th:utext”一般用于在标签内容添加HTML子元素，“th:text”用于输出文本内容，此属性与[[${}]]的作用相同。

<div th:style="${color}" th:utext="${msg}"></div>

运行test.do，页面显示效果如下

3、通过属性赋值

在一些业务中，某个属性可能需要根据条件来判断是否添加，比如checkbox的checkbox属性，input的readonly等。此时可以使用"th:attr"属性

示例：

在WebContent创建img目录，复制一张图片到此目录中，重命名为“test.xxx”，

在TestServlet的request中添加属性，保存此图片的路径

request.setAttribute("url", "/img/test.jpg");

在test.html中添加img标签，标签使用"th:attr"给src属性赋值

<img th:attr="src=@{${url}}"  width="200"/>

运行test.do，页面显示效果如下

“th:attr”也可以同时给多个属性赋值，比如图片的路径和宽度

 文章来源于哔站《三、thymeleaf基本语法》

更多学习视频和专栏文章请到哔站个人空间： 布道师学院的个人空间-布道师学院个人主页-哔哩哔哩视频

更多资源和项目下载请到：”开源吧（找实战项目和毕设项目的好网站）“ ​ ：开源吧















相关文章：
















三、thymeleaf基本语法




3.1、基本语法 
3.1.1变量表达式&#xff1a;${...} 
变量表达式用于在页面中输出指定的内容&#xff0c;此内容可以是变量&#xff0c;可以是集合的元素&#xff0c;也可以是对象的属性。主要用于填充标签的属性值&#xff0c;标签内的文本&#xff0c;以及页面中js变量的值等…...






编程日记
2023/10/5 6:47:49



















创建一个新的IDEA插件项目




启动IntelliJ IDEA并按照以下步骤创建新的插件项目&#xff1a; 打开IntelliJ IDEA并单击“Create New Project”&#xff08;创建新项目&#xff09;。  在左侧菜单栏中选择“IntelliJ Platform Plugin”&#xff08;IntelliJ平台插件&#xff09;。  在右侧窗格中&#xff0c…...






编程日记
2023/10/5 6:40:41



















Doris数据库BE——冷热数据方案




新的冷热数据方案是在整合了存算分离模型的基础上建立的&#xff0c;其核心思路是&#xff1a;DORIS本地存储作为热数据的载体&#xff0c;而外部集群&#xff08;HDFS、S3等&#xff09;作为冷数据的载体。数据在导入的过程中&#xff0c;先作为热数据存在&#xff0c;存储于B…...






编程日记
2023/10/5 6:38:39



















Python无废话-办公自动化Excel格式美化




设置字体 
在使用openpyxl 处理excel 设置格式&#xff0c;需要导入Font类&#xff0c;设置Font初始化参数&#xff0c;常见参数如下&#xff1a; 关键字参数   数据类型   描述  name  字符串  字体名称&#xff0c;如Calibri或Times New Roman  size  整型  大小点数  bold  …...






编程日记
2023/10/5 6:37:38



















竞赛 机器视觉的试卷批改系统 - opencv python 视觉识别




文章目录 0 简介1 项目背景2 项目目的3 系统设计3.1 目标对象3.2 系统架构3.3 软件设计方案 4 图像预处理4.1 灰度二值化4.2 形态学处理4.3 算式提取4.4 倾斜校正4.5 字符分割 5 字符识别5.1 支持向量机原理5.2 基于SVM的字符识别5.3 SVM算法实现 6 算法测试7 系统实现8 最后 0…...






编程日记
2023/10/5 6:35:37



















Django 数据库迁移（Django-04）




一 数据库迁移 
数据库迁移是一种数据库管理技术&#xff0c;它用于在应用程序的开发过程中&#xff0c;根据模型&#xff08;Model&#xff09;的变化自动更新数据库结构&#xff0c;以保持数据库与代码模型的一致性。数据库迁移的主要目的是确保数据库与应用程序的模型定义同…...






编程日记
2023/10/5 6:34:35



















Redis相关概念




1. 什么是Redis&#xff1f;它主要用来什么的&#xff1f; Redis&#xff0c;英文全称是Remote Dictionary Server&#xff08;远程字典服务&#xff09;&#xff0c;是一个开源的使用ANSI C语言编写、支持网络、可基于内存亦可持久化的日志型、Key-Value数据库&#xff0c;并提…...






编程日记
2023/10/5 6:32:32



















Scala第十八章节




Scala第十八章节 
scala总目录 文档资料下载 
章节目标 
掌握Iterable集合相关内容.掌握Seq集合相关内容.掌握Set集合相关内容.掌握Map集合相关内容.掌握统计字符个数案例. 1. Iterable 
1.1 概述 
Iterable代表一个可以迭代的集合, 它继承了Traversable特质, 同时也是其他集合…...






编程日记
2023/10/5 6:29:29



















JAVA学习(4)-全网最详细~




&#x1f308;write in front&#x1f308; &#x1f9f8;大家好&#xff0c;我是Aileen&#x1f9f8;.希望你看完之后&#xff0c;能对你有所帮助&#xff0c;不足请指正&#xff01;共同学习交流. &#x1f194;本文由Aileen_0v0&#x1f9f8; 原创 CSDN首发&#x1f412; 如…...






编程日记
2023/10/5 6:28:28



















【单片机】12-串口通信和RS485




1.通信有关的常见概念 
区分&#xff1a;串口&#xff0c;COM口&#xff0c;UART&#xff0c;USART_usart和串口区别-CSDN博客 
串口、COM口、UART口, TTL、RS-232、RS-485区别详解-CSDN博客 1.什么是通信 &#xff08;1&#xff09;人和人之间的通信&#xff1a;说话&#xff…...






编程日记
2023/10/5 6:26:27



















一步步教你使用GDB调试程序：从入门到精通的全面指南




文章目录 Step1&#xff1a;安装GDB1.1、包管理器安装1.2、下载源码编译安装 Step2&#xff1a;编译程序时添加调试信息Step3&#xff1a;GDB启动、退出、查看代码Step4&#xff1a;GDB断点操作Step5&#xff1a;GDB调试操作5.1 单步调试5.2 多进程调试 调试是软件开发中非常重…...






编程日记
2023/10/5 6:25:26



















OpenCV读取图像时按照BGR的顺序HWC排列,PyTorch按照RGB的顺序CHW排列




OpenCV读取RGB图像 
在OpenCV中&#xff0c;读取的图片默认是HWC格式&#xff0c;即按照高度、宽度和通道数的顺序排列图像尺寸的格式。我们看最后一个维度是C&#xff0c;因此最小颗粒度是C。 
例如&#xff0c;一张形状为2562563的RGB图像&#xff0c;在OpenCV中读取后的格式…...






编程日记
2023/10/5 6:23:25



















基于安卓android微信小程序的校园维修平台




项目介绍 
随着社会的发展&#xff0c;社会的方方面面都在利用信息化时代的优势。互联网的优势和普及使得各种系统的开发成为必需。 本文以实际运用为开发背景&#xff0c;运用软件工程原理和开发方法&#xff0c;它主要是采用java语言技术和mysql数据库来完成对系统的设计。整…...






编程日记
2023/10/5 6:21:22



















mysql面试题16：说说分库与分表的设计？常用的分库分表中间件有哪些？分库分表可能遇到的问题有哪些？




该文章专注于面试，面试只要回答关键点即可，不需要对框架有非常深入的回答，如果你想应付面试，是足够了，抓住关键点 
面试官：说说分库与分表的设计？ 
在MySQL中，分库与分表是常用的数据库水平扩展技术，可以提高数据库的吞吐量和扩展性。下面将具体讲解MySQL中分库与分表…...






编程日记
2023/10/5 6:20:21



















AlexNet网络复现




1. 引言 
在现代计算机视觉领域&#xff0c;深度学习已经成为了一个核心技术&#xff0c;其影响力远超过了传统的图像处理方法。但深度学习&#xff0c;特别是卷积神经网络&#xff08;CNN&#xff09;在计算机视觉的主导地位并不是从一开始就有的。在2012年之前&#xff0c;计…...






编程日记
2023/10/5 6:17:19



















pytorch模型量化和移植安卓详细教程




十一下雨，在家撸模型，希望对pytorch模型进行轻量化，间断摸索了几天，效果不错，做个总结分享出来。 量化是一种常见的技术，人们使用它来使模型在推断时运行更快，具有更低的内存占用和更低的功耗，而无需更改模型架构。在这篇博客文章中，我们将简要介绍量化是什么以及如何…...






编程日记
2023/10/5 6:16:18



















C++(List）




本节目标&#xff1a; 1.list介绍及使用 
2.list深度剖析及模拟实现 
3.list和vector对比 1.list介绍及使用 
1.1list介绍 1. list是可以在常数范围内在任意位置进行插入和删除的序列式容器&#xff0c;并且该容器可以前后双向迭代。 
2. list的底层是双向链表结构&#xff0c;…...






编程日记
2023/10/5 6:15:17



















分布式架构篇




1、微服务 
微服务架构风格&#xff0c;就像是把一个单独的应用程序开发为一套小服务&#xff0c;每个服务运行在自己的进程中&#xff0c;并使用轻量级机制通信&#xff0c;通常是 HTTP API。这些服务围绕业务能力来构建&#xff0c;并通过完全自动化部署机制来独立部署。这些…...






编程日记
2023/10/5 6:14:16



















ros编译报错-- Could NOT find ros_ethercat_eml (missing: ros_ethercat_eml_DIR)




– Could NOT find ros_ethercat_eml (missing: ros_ethercat_eml_DIR) – Could not find the required component ‘ros_ethercat_eml’. The following CMake error indicates that you either need to install the package with the same name or change your environment …...






编程日记
2023/10/5 6:12:14



















VD6283TX环境光传感器驱动开发(3)----测试闪烁频率代码




VD6283TX环境光传感器驱动开发----3.测试闪烁频率代码 概述视频教学样品申请源码下载参考代码开发板设置测试结果 概述 
ST提供了6283A1_AnalogFlicker代码在X-NUCLEO-6283A1获取闪烁频率&#xff0c;同时移植到VD6283TX-SATEL。 闪烁频率提取主要用于检测光源的闪烁频率&#…...






编程日记
2023/10/5 6:11:14



















透明度和透明贴图制作玻璃水杯




1、什么是透明度 
模型透明度是指一个物体或模型在呈现时的透明程度。它决定了物体在渲染时&#xff0c;是否显示其后面的物体或背景。 
在图形渲染中&#xff0c;透明度通常以0到1之间的值表示。值为0表示完全透明&#xff0c;即物体不可见&#xff0c;背景或其他物体完全穿透…...






编程日记
2023/10/5 6:09:12



















【前后缀技巧】2022牛客多校3 A




登录—专业IT笔试面试备考平台_牛客网 
题意&#xff1a; 思路&#xff1a; 
这种是典中典中典&#xff0c;对于gcd&#xff0c;背包问题都是一样的处理方式 
预处理出前缀lca和后缀lca&#xff0c;枚举哪个消失即可&#xff0c;可以统计方案数 
Code&#xff1a; 
#include &l…...






编程日记
2023/10/5 6:08:11



















Ae 效果：CC Page Turn




扭曲/CC Page Turn Distort/CC Page Turn CC Page Turn &#xff08;CC 翻页&#xff09;主要用于模拟书页翻动的效果。通过使用该效果&#xff0c;用户可以创建出像书页或杂志页面翻动的视觉效果&#xff0c;增强影片的交互性和视觉吸引力。   ◆  ◆  ◆ 效果属性说明 Contro…...






编程日记
2023/10/5 6:07:09



















【数据仓库设计基础（四）】数据仓库实施步骤




文章目录 1&#xff0e;定义范围2&#xff0e;确定需求3&#xff0e;逻辑设计1&#xff09;建立需要的数据列表2&#xff09;识别数据源3&#xff09;制作实体关系图 4&#xff0e;物理设计1&#xff09;性能优化2&#xff09;数仓的拓展性 5&#xff0e;装载数据6&#xff0e;…...






编程日记
2023/10/5 6:06:08



















GridSearchCV 工具介绍




目录 
1、定义 
2、工作流程 
3、示例代码 
4、总结 
1、定义 
GridSearchCV 是一个用于超参数调优的工具&#xff0c;它在给定的参数网格中执行交叉验证&#xff0c;以确定最佳的参数组合。通过穷举搜索&#xff08;exhaustive search&#xff09;来寻找最佳参数&#xff0c;即…...






编程日记
2023/10/5 6:05:08



















基于 SSM 框架的旅游文化管理平台




本系统采用基于JAVA语言实现、架构模式选择B/S架构&#xff0c;Tomcat7.0及以上作为运行服务器支持&#xff0c;基于JAVA等主要技术和框架设计&#xff0c;idea作为开发环境&#xff0c;数据库采用MYSQL5.7以上。 
开发环境&#xff1a; JDK版本&#xff1a;JDK1.8 服务器&…...






编程日记
2023/10/5 6:03:06



















chatgpt技术总结（包括transformer，注意力机制，迁移学习，Ray，TensorFlow，Pytorch）




最近研读了一些技术大咖对chatgpt的技术研讨&#xff0c;结合自己的一些浅见&#xff0c;进行些许探讨。 我们惊讶的发现&#xff0c;chatgpt所使用的技术并没有惊天地泣鬼神的创新&#xff0c;它只是将过去的技术潜能结合现在的硬件最大化的发挥出来&#xff0c;也正因如此&am…...






编程日记
2023/10/5 6:02:04



















vertx的学习总结4




一、异步数据和事件流 
1.为什么流是事件之上的一个有用的抽象&#xff1f; 
2.什么是背压&#xff0c;为什么它是异步生产者和消费者的基础&#xff1f; 
3.如何从流解析协议数据&#xff1f; 
1.  答&#xff1a;因为它能够将连续的事件序列化并按照顺序进行处理。通过将事件…...






编程日记
2023/10/5 6:01:03



















SpringBoot心旅售票管理系统




本心旅售票管理系统采用基于JAVA语言实现、架构模式选择B/S架构&#xff0c;Tomcat7.0及以上作为运行服务器支持&#xff0c;基于JAVA、springboot、vue等主要技术和框架设计&#xff0c;idea作为开发环境&#xff0c;数据库采用MYSQL5.7以上。 
采用技术: SpringBootVueMySQL...






编程日记
2023/10/5 6:00:01



















CUDA C编程权威指南：1-基于CUDA的异构并行计算




什么是CUDA&#xff1f;CUDA&#xff08;Compute Unified Device Architecture,统一计算设备架构&#xff09;是NVIDIA&#xff08;英伟达&#xff09;提出的并行计算架构&#xff0c;结合了CPU和GPU的优点&#xff0c;主要用来处理密集型及并行计算。什么是异构计算&#xff1…...






编程日记
2023/10/5 5:59:00



















wordpress安全防范教程/建站模板哪个好




录像机本地激活&#xff0c;录像机本地激活失败一般会提示激活失败或者超时。激活失败如何处理呢&#xff1f;①检查激活密码:录像机一键激活摄像机一般是用的录像机的管理员密码或者IPC密码激活的&#xff0c;如果密码里面含有admin可能就会出现激活失败。基于安全考虑部分前端…...






编程日记
2025/1/10 5:18:36



















wordpress 4.0 文章标题翻译插件/北京网站seo技术厂家




在前些年&#xff0c;计算机专业绝对是最热门的专业之一&#xff0c;时至今日&#xff0c;计算机专业仍然很受欢迎&#xff0c;很多人认为选择了计算机专业&#xff0c;将来就会有一份高薪工作。随着时代的发展&#xff0c;各个行业也都在不断进步&#xff0c;现在的计算机专业…...






编程日记
2025/1/10 1:22:18



















企业做的网站推广方案的步骤/nba实力榜最新排名




题目 
有一个长度为 n 的序列 a1,a2,…,an&#xff0c;某些位置已经固定 (ai>0)&#xff0c;其他位置允许乱填 (ai0)。 
现求一种填法&#xff0c;使得填完之后&#xff0c;序列的任意连续子串的和都是质数。换句话说&#xff0c;对于一切 1≤l≤r≤n&#xff0c;alal1⋯ar …...






编程日记
2025/1/9 21:33:59



















怎样解除拦截网站设置/图片优化




1. TotalCommand    http://www.ghisler.com/      推荐它的理由&#xff0c;无须多言&#xff0c;看看这个网站至今的访问量&#xff0c;你就知道这是一款多么实用的软件了.这款软件在实际开发工作中&#xff0c;大大提高了我的工作效率. 2. Dia http://projects.gnome.org/di…...






编程日记
2025/1/9 19:01:43



















成都房地产经纪协会/广告优化师是做什么的




Python处理json模块的详细介绍&#xff0c;python安装json库前言本文的文字及图片来源于网络,仅供学习、交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理。首先&#xff0c;了解下什么是JSON&#xff1f;JSON&#xff1a;JavaScript Object Nota…...






编程日记
2025/1/9 16:44:51



















网站公告栏模板/百度登录




今天和大家分享一个后台文件管理demo&#xff0c;包括图片管理、视频管理、音乐管理、文档管理和其它文件管理。这个demo也可以看做云盘、网盘的demo。该原型交互效果齐全&#xff0c;使用也简单&#xff0c;只需要填写中继器表格即可。所以推荐给大家使用&#xff0c;喜欢原型…...






编程日记
2025/1/9 15:50:47