html/js/jsp/jquery/el/thymeleaf/servlet/Applet/Velocity

最新推荐文章于 2021-04-29 20:18:09 发布

linzhiji

最新推荐文章于 2021-04-29 20:18:09 发布

阅读量201

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/linzhiji/article/details/107483028

版权

前端专栏收录该内容

57 篇文章 1 订阅

订阅专栏

HTML（Hypertext Markup Language)

是文本标记语言，它是静态页面。是一种解释性语言，所谓解释性语言就是指可以在浏览器上显示出来，不需要编译工具的语言。

JSP（Java server page ）

是通过java语言实现的，是Java语言的一种使用方式，从其英文全称就可以看出它是Java服务器端页面，所以是动态页面。需要经过JDK编译后发送给客户端显示。

JSP是一种动态网页开发技术。它使用JSP标签在HTML网页中插入Java代码。标签通常以<%开头以%>结束。


<%
   Date date = new Date();
   out.print( "<h2 align=\"center\">" +date.toString()+"</h2>");
%>

JS(javaScript)

是一种脚本语言。可以以<script> code </script>的形式混合在HTML页面中，使页面产生动态效果。

jQuery

是一个 JavaScript 库，jQuery 库可以通过一行简单的标记被添加到网页中。jQuery是一个轻量级的"写的少，做的多"的JavaScript库。

jQuery库包含以下功能：

HTML 元素选取
HTML 元素操作
CSS 操作
HTML 事件函数
JavaScript 特效和动画
HTML DOM 遍历和修改
AJAX
Utilities

EL表达式

EL（Express Lanuage）表达式可以嵌入在jsp页面内部，减少jsp脚本的编写，EL出现的目的是要替代jsp页面中脚本的编写。

简单来说EL表达式就是让程序员，简化了代码的书写量。在学EL表达式之前我们必须通过<%= %>来取出域中的数据，但这种方式过于繁琐，所以就诞生了EL表达式。

EL取出JSP四大域对象中保存的数据

pageContext域：${pageScope.key};
request域：${requestScope.key};
session域：${sessionScope.key};
application域：${applicationScope.key}

<% 
    User u = new User();
    u.setName("张叉叉");
    request.setAttribute("user",u);
%>
#使用el表达式可以获取bean的属性：
${user.name}

EL表达式

thymeleaf

简单说， Thymeleaf 是一个跟 Velocity、FreeMarker 类似的模板引擎，它可以完全替代 JSP 。

Thymeleaf入门到吃灰

SpringBoot页面展示Thymeleaf

创建一个Controller对象，在其中进行参数的传递

@Controller
public class ThymeleafController {

    @RequestMapping(value = "show", method = RequestMethod.GET)
    public String show(Model model){
        model.addAttribute("uid","123456789");
        model.addAttribute("name","Jerry");
        return "show";
    }
}

在SpringBoot默认的页面路径下创建show.html文件，内容如下

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>SpringBoot模版渲染</title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
</head>
<body>
    <p th:text="'用户ID：' + ${uid}"/>
    <p th:text="'用户名称：' + ${name}"/>
</body>
</html>

可以看到在p标签中有th:text属性，这个就是thymeleaf的语法，它表示显示一个普通的文本信息。

跟前面EL表达式很像，区别就在于th:text，加了th