编辑推荐

网易数帆开源API网关与容器云项目，让云原生生产落地“多快好

网易汪源：统一负载与多云环境的“开放姿态”，才是云原生

网易数帆如何用 Kubernetes“原语”搞定云原生中间件

快手打新挤爆券商系统，网易数帆推出券商稳定性保障方案

探索智慧校园新模式，网易有数在教育行业的实践分享

金融行业大数据治理之路——数据模型篇

springboot + thymeleaf

叁叁肆2018-12-02 14:13

此文已由作者赵计刚薪授权网易云社区发布。

欢迎访问网易云社区，了解更多网易技术产品运营经验。

代码结构：

1、ThymeleafController

View Code

说明：

第一个是springMVC经典返回形式modelAndView
第二个是ajax返回形式

2、index.html

 1 <!DOCTYPE HTML>
 2 <html xmlns:th="http://www.thymeleaf.org">
 3 <head>
 4 <title>index</title>
 5 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 6 
 7 <link th:href="@{/bootstrap/css/bootstrap.min.css}" rel="stylesheet"/>
 8 <link th:href="@{/bootstrap/css/bootstrap-theme.min.css}" rel="stylesheet" />
 9 </head>
10 <body>
11     <div class="panel panel-primary">
12         <div class="panel-heading">hello</div>
13         <div class="panel-body" th:text="${xname}"></div>
14     </div>
15     <div class="panel panel-warning">
16         <div class="panel-heading">hello</div>
17         <div id="usernamediv" class="panel-body"></div>
18     </div>
19     <script type="text/javascript" th:src="@{/js/jquery-1.11.1.js}"></script>
20     <script type="text/javascript" th:src="@{/bootstrap/js/bootstrap.min.js}"></script>
21     <script th:inline="javascript">
22         $(function(){
23             $.ajax({
24                 url:"/thymeleaf/ajax",
25                 data:{
26                     username:"xxx"
27                 },
28                 type:"get",
29                 dataType:"text",
30                 success:function(text){
31                     alert(text);
32                     $("#usernamediv").text(text);
33                 }
34             });
35         });
36     </script>
37 </body>
38 </html>

说明：