【SpringBoot】| Thymeleaf 模板引擎插入模板insert包含模板include引入整个footer.html到此页面我是一个标签引入其它目录下的页面到此页面 - 机房托管|北京机房租用|IDC机柜租用租赁|电信联通移动机房机柜|带宽租用-价格及费用咨询

Thymeleaf 模板引擎

1. 第一个例子

2. 表达式

①标准变量表达式

②选择变量表达式（星号变量表达式）

③链接表达式（URL表达式）

3. Thymeleaf的属性

①th:action

②th:method

③th:href

④th:src

⑤th:text

⑥th:style

⑦th:each （重点）

⑧条件判断 if-unless

⑨switch-case 判断语句

⑩th:inline内联

内联 text

内联javascript

4. 字面量

5.字符串连接（重要）

6. 运算符

7. Thymeleaf内置对象

8. Thymeleaf内置工具类对象

9.自定义模板（内容复用）

模板语法

插入模板和包含模板

整个html页面作为模板插入

图书推荐：《巧用ChatGPT轻松玩转新媒体运营》

Thymeleaf 模板引擎

        Thymeleaf 是一个流行的模板引擎，该模板引擎采用 Java 语言开发。

        模板引擎是一个技术名词，是跨领域跨平台的概念，在 Java 语言体系下有模板引擎，在 C#、PHP 语言体系下也有模板引擎，甚至在 JavaScript 中也会用到模板引擎技术，Java 生态下的模板引擎有 Thymeleaf 、Freemaker、Velocity、Beetl（国产）等。

        Thymeleaf 对网络环境不存在严格的要求，既能用于 Web 环境下，也能用于非 Web 环境下。在非 Web 环境下，他能直接显示模板上的静态数据；在 Web 环境下，它能像 Jsp 一样从后台接收数据并替换掉模板上的静态数据。它是基于 HTML 的，以 HTML 标签为载体， Thymeleaf 要寄托在 HTML 标签下实现。

        Spring Boot 集成了 Thymeleaf 模板技术，并且 Spring Boot 官方也推荐使用 Thymeleaf 来替代 JSP 技术，Thymeleaf 是另外的一种模板技术，它本身并不属于 Spring Boot，Spring Boot 只是很好地集成这种模板技术，作为前端页面的数据展示，在过去的 Java Web 开发中，我们往往会选择使用 Jsp 去完成页面的动态渲染，但是 jsp 需要翻译编译运行，效率低。

Thymeleaf 的官方网站：Thymeleaf

Thymeleaf 官方手册：Tutorial: Using Thymeleaf

1. 第一个例子

①创建项目，引入web和thymeleaf依赖

②pom.xml主要依赖



    4.0.0
    
        org.springframework.boot
        spring-boot-starter-parent
        2.7.15
         
    
    com.zl
    springboot-myredis
    0.0.1-SNAPSHOT
    springboot-myredis
    springboot-myredis
    
        1.8
    
    
        
        
            org.springframework.boot
            spring-boot-starter-thymeleaf
        
        
        
            org.springframework.boot
            spring-boot-starter-web
        

        
            org.springframework.boot
            spring-boot-devtools
            runtime
            true
        
        
            org.springframework.boot
            spring-boot-configuration-processor
            true
        
        
            org.projectlombok
            lombok
            true
        
        
            org.springframework.boot
            spring-boot-starter-test
            test
        
    

    
        
            
                org.springframework.boot
                spring-boot-maven-plugin
                
                    
                        
                            org.projectlombok
                            lombok

③Controller编写存放数据

package com.zl.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;

import javax.servlet.http.HttpServletRequest;

@Controller
public class HelloThymeleafController {
    @GetMapping("/hello")
    public String helloThymeleafController(HttpServletRequest request){
        // 添加数据到request域当中，模板引擎可以从request域当中获取
        request.setAttribute("data","第一个Thymeleaf数据");
        // 返回到视图(html)
        return "hello";
    }
}

④视图hello.html取出数据（放到templates中）





    
    Title



想显示的数据

⑤进行访问

模板引擎的常用配置

思考：为什么controller返回一个字符串就可以直接找到templates下的对应html呢？这些和模板引擎的默认设置是有关的！

application.properties配置

注：在开发阶段只需要把cache设置为false即可，其它都是默认选项不需要修改！

#开发阶段设置为 false ，上线后设置为 true，默认是true走缓存
spring.thymeleaf.cache=false
# 设置模版文件的路径，前缀，默认就是classpath:/templates/
spring.thymeleaf.prefix=classpath:/templates/ 
# 设置后缀,默认就是 .html
spring.thymeleaf.suffix=.html
#编码方式，默认就是UTF-8，所以中文不会乱码
spring.thymeleaf.encoding=UTF-8
#模板的类型，默认是HTML，模板是html文件
spring.thymeleaf.mode=HTML

2. 表达式

表达式是在页面获取数据的一种 thymeleaf 语法。类似 ${key} 。

①标准变量表达式

注意：th:text=”${key}” 是 Thymeleaf 的一个属性，用于文本的显示。

语法: ${key} 。

说明：标准变量表达式用于访问容器（tomcat）上下文环境中的变量，功能和 EL 中的 ${} 相同。Thymeleaf 中的变量表达式使用 ${变量名} 的方式获取 Controller 中 model 其中的数据。也就是 request 作用域中的数据。

准备Student数据

package com.zl.pojo;

public class Student {
    private String name;
    private Integer age;

    public Student(String name, Integer age) {
        this.name = name;
        this.age = age;
    }

    public Student() {
    }

    @Override
    public String toString() {
        return "Student{" +
                "name='" + name + ''' +
                ", age=" + age +
                '}';
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public Integer getAge() {
        return age;
    }

    public void setAge(Integer age) {
        this.age = age;
    }
}

欢迎页面index.html放入静态资源static下，不走模板引擎




    
    Title


标准变量表达式

application.properties

#配置端口号
server.port=8082
#开发阶段设置为 false ，上线后设置为 true，默认是true走缓存
spring.thymeleaf.cache=false

controller存放数据，跳转到expression1

package com.zl.controller;

import com.zl.pojo.Student;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
@RequestMapping("/thymeleaf")
public class ThymeleafExpressionController {
    @GetMapping("/expression1")
    public String expression1(Model model){
        // 添加数据
        model.addAttribute("student",new Student("Jack",18));   
        // 跳转到视图 
        return "expression1";
    }
}

expression1.html接收数据

注：${student.getName()}也能获取到值，底层实际上就是调用对应的Get方法！




    
    expression1

执行结果：

②选择变量表达式（星号变量表达式）

语法：*{key} 。

说明：不能单独使用，需要配和 th:object 一起使用。选择变量表达式，也叫星号变量表达式，使用 th:object 属性来绑定对象，选择表达式首先使用 th:object 来绑定后台传来的对象，然后使用 * 来代表这个对象，后面 {} 中的值是此对象中的属性。可以简化上述的开发。

欢迎页面




    
    Title


标准变量表达式
选择变量表达式

controller存放数据

    @GetMapping("/expression2")
    public String expression2(Model model){
        model.addAttribute("student",new Student("Jack",18));
        return "expression2";
    }

expression2.html取出数据：使用th:object +*{key}简化上述的开发




    
    expression2

③链接表达式（URL表达式）

语法：@{链接 url} 。

说明：主要用于链接、地址的展示，可用于 , , 等，可以在 URL 路径中动态获取数据。

欢迎页面index.html




    
    Title


标准变量表达式
选择变量表达式
链接表达式

controller测试

package com.zl.controller;

import com.zl.pojo.Student;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

@Controller
@RequestMapping("/thymeleaf")
public class ThymeleafExpressionController {
    @GetMapping("/expression1")
    public String expression1(Model model){
        model.addAttribute("student",new Student("Jack",18));
        return "expression1";
    }

    @GetMapping("/expression2")
    public String expression2(Model model){
        model.addAttribute("student",new Student("Jack",18));
        return "expression2";
    }

    // 链接表达式
    @GetMapping("/expression3")
    public String expression3(Model model){
        model.addAttribute("userId",1001);
        model.addAttribute("userName","Jack");
        return "expression3";
    }

    // 测试连接表达式
    @GetMapping("/query1")
    @ResponseBody
    public String query1(){ // 无参
        return "id=";
    }

    @GetMapping("/query2")
    @ResponseBody
    public String query2(Integer id){ // 一个参数
        return "id="+id;
    }

    @GetMapping("/query3")
    @ResponseBody
    public String query3(Integer id,String name){
        return "id="+id+",name="+name;
    }
}

expression3.html




    
    expression3



    
    链接到百度

   
   测试无参链接表达式

    
   测试一个参数的链接表达式
    
   常用的传参方式

   测试两个参数的链接表达式

3. Thymeleaf的属性

大部分属性和 html 的一样，只不过前面加了一个 th 前缀。加了 th 前缀的属性，是经过模版引擎处理的。在属性上也可以使用变量表达式！

①th:action

定义后台控制器的路径，类似标签的 action 属性，主要结合 URL 表达式,获取动态变量

......

②th:method

设置请求方法

③th:href

定义超链接，主要结合 URL 表达式,获取动态变量

相对地址没有传参数

④th:src

用于外部资源引入，比如标签的 src 属性，标签的 src 属性，常与@{}表达式结合使用，在 SpringBoot 项目的静态资源都放到 resources 的 static 目录下，放到 static 路径下的内容，写路径时不需要写上 static

⑤th:text

用于文本的显示，该属性显示的文本在标签体中，如果是文本框，数据会在文本框外显示，要想显示在文本框内，使用 th:value

⑥th:style

设置样式

点击我

例1：

第一步：欢迎页面

模板的属性

第二步：controller准备数据

package com.zl.controller;

import com.zl.pojo.Student;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

@Controller
@RequestMapping("/thymeleaf")
public class ThymeleafExpressionController {
    @GetMapping("/property")
    public String useProperty(Model model){
        model.addAttribute("methodAttr","post");
        model.addAttribute("id","123");

        model.addAttribute("userName","Jack");
        model.addAttribute("userValue","lisi");
        
        return "html-property";
    }
}

第三步：html-property.html获取数据




    
    模板的属性


    
        
        
        
    

    
        function btnOnclick() {
            alert("按钮单击了");
        }

F12查看

⑦th:each （重点）

这个属性非常常用，比如从后台传来一个对象集合那么就可以使用此属性遍历输出，它与 JSTL 中的类似，此属性既可以循环遍历集合，也可以循环遍历数组及 Map！

例2：循环list集合或数组

第一步：欢迎页面

循环遍历List

第二步：controller准备数据

package com.zl.controller;

import com.zl.pojo.Student;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

import java.util.ArrayList;
@Controller
@RequestMapping("/thymeleaf")
public class ThymeleafExpressionController {
    @GetMapping("/eachList")
    public String eachList(Model model){
        // 准备数据
        ArrayList studentList = new ArrayList();
        Student s1 = new Student("zhangsan", 18);
        Student s2 = new Student("lisi", 20);
        Student s3 = new Student("wangwu", 22);
        studentList.add(s1);
        studentList.add(s2);
        studentList.add(s3);
        // 放入域当中
        model.addAttribute("students",studentList);
        return "student-list";
    }

}

第三步：student-list.html获取数据




    
    eachList




    
        姓名
        年龄

补充：实际上完整的遍历格式如下：

循环的状态变量，可以定义也可以不定义，通过该变量可以获取如下信息：

①index: 当前迭代对象的 index（从 0 开始计算）；

②count: 当前迭代对象的个数（从 1 开始计算）这两个用的较多；

③size: 被迭代对象的大小；

④current: 当前迭代变量，stuState.current就相当于循环变量stu；

⑤even/odd: 布尔值，当前循环是否是偶数/奇数（从 0 开始计算）；

⑥first: 布尔值，当前循环是否是第一个；

⑦last: 布尔值，当前循环是否是最后一个；

例如：获取当前迭代对象的个数

注意：循环体信息 userStat 也可以不定义，则默认采用迭代变量加上 Stat 后缀，即

userStat。




    
    eachList




    
        序号
        姓名
        年龄

执行结果

例3：循环map集合

以key和value的方式存放数据

    @GetMapping("/eachMap")
    public String eacMap(Model model){
        // 准备数据
        HashMap studentHashMap = new HashMap();
        Student s1 = new Student("zhangsan", 18);
        Student s2 = new Student("lisi", 20);
        Student s3 = new Student("wangwu", 22);
        studentHashMap.put("s1",s1);
        studentHashMap.put("s2",s2);
        studentHashMap.put("s3",s3);
        // 放入域当中
        model.addAttribute("studentHashMap",studentHashMap);
        return "student-map";
    }

取出数据

①调用循环变量的key属性拿到Map集合的key；

②调用循环变量的value属性拿到Map集合的value，此时拿到的value是Java对象，可以继续点下去取里面的成员变量属性；




    
    eachList

执行结果：

例4：List

复杂的List和Map集合的嵌套

存入两个map集合的数据到list集合

    @GetMapping("/eachListMap")
    public String eachListMap(Model model){
        // 准备一个listmap
        List> listmap = new ArrayList();
        // 第一个map1数据
        HashMap map1 = new HashMap();
        Student s1 = new Student("zhangsan", 18);
        Student s2 = new Student("lisi", 20);
        map1.put("s1",s1);
        map1.put("s2",s2);
        // 第二个map2数据
        HashMap map2 = new HashMap();
        Student s3 = new Student("Jack", 22);
        Student s4 = new Student("Rose", 22);
        map2.put("s3",s3);
        map2.put("s4",s4);
        // 把map集合放入list集合当中
        listmap.add(map1);
        listmap.add(map2);
        // 放入域当中
        model.addAttribute("listmap",listmap);
        return "student-listmap";
    }

两层each循环取出数据




    
    eachList

执行结果：

⑧条件判断 if-unless

“th:if” : 判断语句，当条件为true，显示html标签体内，反之不显示没有else语句。

语法：th:if=”boolean 条件” ， 条件为 true 显示体内容 
      th:unless 是 th:if 的一个相反操作，条件为 false 显示体内容

第一步：index.html

判断语句if-unless

第二步：controller发出请求

    @GetMapping("/ifunless")
    public String ifUnless(Model model){
        // 有正常数据
        model.addAttribute("sex","m");
        // 数据为空字符串
        model.addAttribute("name","");
        // 数据为null
        model.addAttribute("isOld",null);
        return "if-unless";
    }

第三步：前端进行判断




    
    条件判断if-unless



    我是男孩子
    
    name是""
    
    isOld是null
    
    isOld是null------

执行结果：

①if是条件为true显示结果，unless是条件为假显示结果；

②空字符串“”会被当做true来处理；

③nulll会被当做fale处理；

⑨switch-case 判断语句

语法：类似 java 中的 switch，case；最多只能有一个case匹配成功。


    
        结果1
    
    
        结果2
    
    
        默认结果
    
    以上的case只有一个语句执行

controller存储数据

    @GetMapping("/switchcase")
    public String switchCase(Model model){
        model.addAttribute("a","m");
        model.addAttribute("b","f");
        model.addAttribute("c","mf");
        return "swicth-case";
    }

html取出数据并判断




    
    swicth-case条件判断



    
        男
        女
        未知
    
    
    
        男
        女
        未知
    
    
    
        男
        女
        未知

执行结果：

总结：一旦某个 case 判断值为 true，剩余的 case 则都当做 false，“*”表示默认的case，前面的case 都不匹配时候，执行默认的 case。

⑩th:inline内联

th:inline 有三个取值类型 (text, javascript 和 none) ！none就表示无的意思。

内联 text

可以让 Thymeleaf 表达式不依赖于 html 标签，直接使用内敛表达式[[表达式]]即可获取动态数据，要求在父级标签上加 th:inline = “text”属性。

controller存储数据

package com.zl.controller;

import com.zl.pojo.Student;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

import java.security.PublicKey;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

@Controller
@RequestMapping("/thymeleaf")
public class ThymeleafExpressionController {
    @GetMapping("/inline/text")
    public String inlineText(Model model){
        model.addAttribute("name","Jack");
        model.addAttribute("age",22);
        return "inline-text";
    }
}

使用内联text取出数据

第一步：父级标签上加 th:inline = “text”；实际上这部分可以省略。

第二步：使用[[${变量的方式}]]。




    
    inline-text



    
    


    
    [[${age}]]

成功取出数据

内联javascript

就是在 js 中，获取模版中的数据！

使用内联javascript取出上述存取的数据

第一步：引入script标签，在标签中引入th:inline = “javascript”；

第二步：在js中取出数据，取出方式和内联text相同；




    
    inline-text





    /*使用js代码获取数据*/
    var name = [[${name}]];
    var age = [[${age}]];
    
    alert("用户名"+name+",年龄"+age);
    
    function btnOnclick(){
        alert("用户名"+name+",年龄"+age);
    }

执行结果

4. 字面量

①文本字面量，单引号’…’包围的字符串为文本字面量；

②数字字面量；

③boolean字面量；

④null字面量；

第一步：欢迎页面index.html

字面量

第二步：域中存数据

    @GetMapping("/text")
    public String text(Model model){
        model.addAttribute("sex","m");
        model.addAttribute("isLogin",true);
        model.addAttribute("age",10);
        model.addAttribute("name",null);
        model.addAttribute("city","北京");
        return "text";
    }

第三步：取出数据




    
    字面量






   我的城市是[[${city}]]



age>8

登陆了

name是null

执行结果：

5.字符串连接（重要）

第一种方式：使用单引号括起来字符串，使用 + 连接其他的字符串或者表达式；

 数据显示

第二种方式：使用双竖线||，例如：|字符串内容|；


    显示数据

controllelr存储数据

    @GetMapping("/stringbuf")
    public String stringBuf(Model model){
        model.addAttribute("name","Jack");
        model.addAttribute("age",45);
        model.addAttribute("student",new Student("张三",16));
        return "stringbuf";
    }

进行字符串的拼接

执行结果

6. 运算符

①算术运算： + , – , * , / , %
②关系比较 : > , = , gt , lt , ge , le )
③相等判断： == , != ( eq , ne )

④三元运算符：表达式？ true的结果 : false的结果

controller存储数据

    @GetMapping("/data")
    public String data(Model model){
        model.addAttribute("name1",null);
        model.addAttribute("name2","Jack");
        model.addAttribute("age",18);
        model.addAttribute("isLogin",true);
        return "data";
    }

进行数据的运算符比较

注：对于内层嵌套的三元运算符，内层嵌套的不用${}。




    
    运算符的比较



    
    
    
    
    年龄大于10
    年龄大于10
    
    name1是null
    name2不是null

执行结果：

7. Thymeleaf内置对象

模板引擎提供了一组内置的对象，这些内置的对象可以直接在模板中使用，这些对象由#

号开始引用，我们比较常用的内置对象：

①#request 表示 HttpServletRequest ；

②#session 表示 HttpSession 对象；

③session 本质上是一个Map集合，是#session的简单表示方式，用来获取session中指定的key的值；

#session.getAttribute("loginname") == session.loginname

controller存数据

    @GetMapping("/baseObject")
    public String baseObject(Model model, HttpServletRequest request,
                             HttpSession session){
        model.addAttribute("name","Jack");
        request.setAttribute("requestData","request作用域中的对象");
        session.setAttribute("sessionData","session作用域中的对象");
        return "baseObject";
    }

一：获取作用域中的数据




    
    内置对象

执行结果：

思考：剖析session对象；实际上session对象本质上是一个Map，存入的数据以key和value的形式存储，所以session.key的方式底层实际上就是调用map.get(key)的方式取出value数据

二：使用内置对象的方法

①getRequestURL()，获取完整的地址信息（不包含参数）；

②getRequestURI()，获取地址信息（不包含IP地址、端口号、参数）；

③getQueryString()，获取参数信息；

④getContextPath()，获取根路径；

⑤getServerName()，获取IP地址；

⑥getServerPort()，获取端口号；




    
    内置对象

执行结果：

8. Thymeleaf内置工具类对象

①模板引擎提供的一组功能性内置对象，可以在模板中直接使用这些对象提供的功能方法；

②工作中常使用的数据类型，如集合，时间，数值，可以使用 Thymeleaf 的提供的功能性对象来处理它们;

③内置功能对象前都需要加#号，内置工具类对象一般都以 s 结尾；

官方手册：Tutorial: Using Thymeleaf

Cat类

package com.zl.vo;

public class Cat {
    private String name;

    public Cat() {
    }

    public Cat(String name) {
        this.name = name;
    }

    @Override
    public String toString() {
        return "Cat{" +
                "name='" + name + ''' +
                '}';
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }
}

Dog类

package com.zl.vo;

public class Dog {
    private String name;

    public Dog() {
    }

    public Dog(String name) {
        this.name = name;
    }

    @Override
    public String toString() {
        return "Dog{" +
                "name='" + name + ''' +
                '}';
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }
}

Zoo类

package com.zl.vo;

public class Zoo {
    private Cat cat;
    private Dog dog;
    public Zoo() {
    }

    public Zoo(Cat cat, Dog dog) {
        this.cat = cat;
        this.dog = dog;
    }

    @Override
    public String toString() {
        return "Zoo{" +
                "cat=" + cat +
                ", dog=" + dog +
                '}';
    }

    public Cat getCat() {
        return cat;
    }

    public void setCat(Cat cat) {
        this.cat = cat;
    }

    public Dog getDog() {
        return dog;
    }

    public void setDog(Dog dog) {
        this.dog = dog;
    }
}

controller存数据

package com.zl.controller;

import com.zl.pojo.Student;
import com.zl.vo.Cat;
import com.zl.vo.Dog;
import com.zl.vo.Zoo;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PutMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpSession;
import java.security.PublicKey;
import java.util.*;

@Controller
@RequestMapping("/thymeleaf")
public class ThymeleafExpressionController {
    @GetMapping("/utilObject")
    public String utilObject(Model model){
        model.addAttribute("mydate",new Date());
        model.addAttribute("number",32.636);
        model.addAttribute("str","hello");
        List list = Arrays.asList("Jack","Rose","King");
        model.addAttribute("list",list);
        
        Cat cat = new Cat("小猫");
        Dog dog = new Dog("二哈");
        zoo.setCat(cat);
        // zoo.setDog(dog);
        model.addAttribute("zoo",zoo);
        
        return "utilObject";
    }
}

一：#dates—处理日期的




    
    内置工具类对象



    日期工具类对象#dates

执行结果：

二：#numbers—处理数字的




    
    内置工具类对象



    数字工具类对象#dates

执行结果：

三：#strings—处理字符串的




    
    内置工具类对象



    字符串工具类对象#strings

执行结果：

四：#lists—处理集合的




    
    内置工具类对象



    集合工具类对象#lists
    
    
    
    list集合包含Rose

执行结果：

五：null处理

正常取出数据




    
    内置工具类对象



    处理null

执行结果：

思考：如果此时对于cat没有赋上值

此时会出现500错误（服务器内部错误）

实际上是出现了空引用，如何避免呢？

在引用的后面使用问号？，如果引用存在就可以向下取属性；如果当前引用为空，直接不显示结果！

执行结果：

9.自定义模板（内容复用）

自定义模板是复用的行为；可以把一些内容，多次重复使用！

模板语法

对于一个自定义模板的使用，主要包括两部分：

定义模板

模板定义语法：th:fragment=”模板自定义名称”


    
        大连
    
    
        www.dlu.com

使用模板

引用模板语法： ~{templatename :: selector} 或者 templatename :: selector

①其中templatename: 文件名称，selector：自定义模板名称；

②对于使用模板：有包含模板（th:include），插入模板(th:insert)；

插入模板和包含模板

注：对于插入模板可以理解为整体的插入，对于包含模板可以理解为整体的替换！

第一步：模板的定义

head.html




    
    Title



    www.baidu.com
    百度官网

第二步：欢迎页面index.html

自定义模板

第三步：controller跳转到customtpl页面

    @GetMapping("/customtpl")
    public String customtpl(){
        return "customtpl";
    }

第四步：customtpl页面使用插入模板和包含模板

①插入模板




    
    Title



    插入模板insert

执行结果：成功插入原来html页面的内容

F12打开前端代码分析：嵌套进去

②包含模板

包含模板include

F12打开前端代码分析：完全替换

整个html页面作为模板插入

footer.html




    
    Title



    footer.html
    @www.baidu.com

此时把整个footer.html页面插入到 customtpl页面

注：前面主要是将某一个代码片段引入到其它页面，这里讲解的是将整个html页面引入到其它页面。

语法格式：

①

②省略后缀名




    
    Title



    引入整个footer.html到此页面

成功引入：

思考：以上是同级目录下的整个html页面的引入，如果是其它目录呢？

在templates目录下有一个common目录，common目录下有一个left.html

left.html




    
    Title


 我是一个标签

引入其它目录下的页面到此页面




    
    Title



    引入其它目录下的页面到此页面

执行结果：成功引入

图书推荐：《巧用ChatGPT轻松玩转新媒体运营》

本次送书 2本！
活动时间：截止到 2023-10-12 00:00:00。

抽奖方式：利用程序进行抽奖。

参与方式：关注博主（只限粉丝福利哦）、点赞、收藏，评论区随机抽取，最多三条评论！

关键点

★超实用通过80多个实战案例和操作技巧，使读者能够快速上手并灵活运用ChatGPT技术及提高运营能力。

★巨全面涵盖10多个新媒体领域，文案写作+图片制作+社交媒体运营+爆款视频文案+私域推广+广告策划+电商平台高效运营等。

★真好懂以通俗易懂的语言解释ChatGPT的原理及应用，轻松提高新媒体运营能力。

★高回报学习本书，全面提升运营能力，大大提高工作效率，促进职业发展，实现自我价值。

内容简介

本书从ChatGPT的基础知识讲起，针对运营工作中的各种痛点，结合实战案例，如文案写作、图片制作、社交媒体运营、爆款视频文案、私域推广、广告策划、电商平台高效运营等，手把手教你使用ChatGPT进行智能化工作。此外，还介绍了通过ChatGPT配合Midjourney、D-ID等AI软件的使用，进一步帮助提高运营工作的效率。

本书内容通俗易懂，案例丰富，实用性较强，特别适合想要掌握ChatGPT对话能力的读者和各行各业的运营人员，如互联网运营人员、自媒体运营人员、广告营销人员、电商运营人员等。另外，本书也适合作为相关培训机构的教材使用。

当当网链接：当当图书

京东的链接：京东安全

Thymeleaf 模板引擎

1. 第一个例子

2. 表达式

①标准变量表达式

②选择变量表达式（星号变量表达式）

③链接表达式（URL表达式）

3. Thymeleaf的属性

①th:action

②th:method

③th:href

④th:src

⑤th:text

⑥th:style

⑦th:each （重点）

⑧条件判断 if-unless

⑨switch-case 判断语句

⑩th:inline内联

内联 text

内联javascript

4. 字面量

5.字符串连接（重要）

6. 运算符

7. Thymeleaf内置对象

8. Thymeleaf内置工具类对象

9.自定义模板（内容复用）

模板语法

插入模板和包含模板

插入模板insert

包含模板include

整个html页面作为模板插入

引入整个footer.html到此页面

我是一个标签

引入其它目录下的页面到此页面

图书推荐：《巧用ChatGPT轻松玩转新媒体运营》

服务器托管，北京服务器托管，服务器租用，机房机柜带宽租用