SpringBoot——Thymeleaf常见属性-th:inline内敛文本text、内敛脚本javascript

最新推荐文章于 2022-09-24 22:18:48 发布

莫得情感的码农

最新推荐文章于 2022-09-24 22:18:48 发布

阅读量729

点赞数

分类专栏： Spring Boot 文章标签： java springboot

本文链接：https://blog.csdn.net/liuhaiyang98/article/details/120734418

版权

Spring Boot 专栏收录该内容

19 篇文章 1 订阅

订阅专栏

引言

th:inline 有三个取值类型 (text, javascript 和 none)，值为 none 什么都不做，没有效果

内敛文本（th:inline=”text”）内敛文本表达式不依赖于 html 标签，直接使用内敛表达式[[表达式]]即可获取动态数据，但必须要求在父级标签上加 th:inline = “text”属性

内敛脚本（th:inline=”javascript”）th:inline=”javascript”在 js 代码中获取后台的动态数据

代码举例

内敛文本和内敛脚本写在一起，对比学习

写一个controller类

package com.liuhaiyang.springboot.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
public class UserController1 {
    @RequestMapping("inline")
    public String Inline(Model model){
        model.addAttribute("data","springboot inline");
        return "inline-test";
    }
}

写一个前端html页面 inline-test展示数据

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>内敛表达式</title>
</head>
<body>
    <div th:text="${data}"></div><br>

    <h1>内敛文本：th:inline="text"</h1>
    <div th:inline="text">
        数据：[[${data}]]
    </div> <br>

<h1>内敛脚本 th:inline="javascript" 帮助显示接收的数据</h1>
<script type="text/javascript" th:inline="javascript">
    function showData(){
        alert([[${data}]]);
        alert("---------");<!--有无内敛脚本都可以显示-->
    }
</script>
<input type="button" value="显示数据" th:onclick="showData()">
</body>
</html>

核心配置文件

spring.thymeleaf.cache=false

启动入口类测试

莫得情感的码农

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
SpringBoot——Thymeleaf常见属性-th:inline内敛文本text、内敛脚本javascript

引言th:inline 有三个取值类型 (text, javascript 和 none)，值为 none 什么都不做，没有效果内敛文本（th:inline=”text”）内敛文本表达式不依赖于 html 标签，直接使用内敛表达式[[表达式]]即可获取动态数据，但必须要求在父级标签上加 th:inline = “text”属性内敛脚本（th:inline=”javascript”）th:inline=”javascript”在 js 代码中获取后台的动态数据代码举例内敛文本和内敛脚本
复制链接

扫一扫