【学习笔记】 Thymeleaf的前端渲染（价值50）

---

配置工具

---

本次配置的工具有：

1：IDEA社区版

2：Thymeleaf的jar包

3：使用稳定版本的1.8jdk

注：一定要使用1.8的jdk！！！不要问为什么，问就是50！！！

---

Thymeleaf环境的配置

---

1、导入jar包，放在同级目录下。

因为我们没有借助SpringBoot框架，所以我们需要手动导入jar包。我们创建一个thymeleaf_lib的文件夹，并把jar包都放在该文件夹下面，然后右键—》Add to Library....。

jar的下载地址：

链接：https://pan.baidu.com/s/1aAu3JD2WqAwGhWZCmoDjLA

提取码：kptf（失效了找我）

---

2、应用Thymeleaf

按照步骤慢慢的打开。Project Structure —》 Modules —》如果已经有了Thymeleaf的话直接点击apply和ok，如果没有的话则需要点加号进行添加，然后再重复apply和OK。

3、Thymeleaf插件的下载和使用

打开下载插件的地方，然后直接搜索Thymeleaf即可，然后下载安装。

确定安装完毕后，我们打开一个HTML文件，然后点击鼠标右键。目录中就有我们已经下载完毕的插件JBLHtmlToThmeleaf，我们只需点击即可。

点击后我们的HTML文件就会出现一行引入Thmeleaf的代码，然后即可使用Thymeleaf对前端页面进行渲染。

//出来的引入代码。

4、web.xml的配置

当上述都配置完毕后，即还剩最后一步—web.xml文件的配置。

view-prefix

/WEB-INF/template/

view-suffix

.html

view-prefix:配置前缀。并需要配置访问的路径即/WEB-INF/template/。

view-suffix:配置访问文件后缀，我们访问的是HTML文件，则需要配置.html文件即可。

**例如：**一个文件为apple.html，已经设置过后缀为html访问时我们只需要再后端程序中访问apple即可。

---

Thymeleaf的基础语法

---

上述我们已经讲过了Thymeleaf的环境配置，接下来就是我们需要使用其对前端页面进行渲染。

在使用前，我们先来了解一下Thymeleaf的基础语法。

1、th:text

其可以改变当前元素里面的文本内容。

333

能够把后端传过来的数据name把333进行覆盖。

2、th:each

循环：

渲染列表数据是一种非常常见的场景，例如现在有 n 条记录需要渲染成一个表格<table>，该数据集合必须是可以遍历的，使用th:each标签。

tyrone

3、th:if

判断：

例如判断数据是否为空：

空

4、th:unless

否者：

和python中的else是相同的。

空 333

最后

资料过多，篇幅有限

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

自古成功在尝试。不尝试永远都不会成功。勇敢的尝试是成功的一半。

ss=“${session.name}”>

333

最后

[外链图片转存中…(img-IxP3cJCN-1714502554300)]

[外链图片转存中…(img-hAXhA8CS-1714502554301)]

资料过多，篇幅有限

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

自古成功在尝试。不尝试永远都不会成功。勇敢的尝试是成功的一半。