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

2021/10/13 1:14:15

编程Tag： javascript 文本 text springboot inline th 内敛

本文主要是介绍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 代码中获取后台的动态数据

代码举例

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

写一个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

启动入口类测试

这篇关于SpringBoot——Thymeleaf常见属性-th:inline内敛文本text、内敛脚本javascript的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！

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

引言

代码举例

相关编程文章