本文共 7880 字，大约阅读时间需要 26 分钟。
JSP模板引擎
了解模板引擎：模板引擎(用于Web开发)是为了使用户界面与业务数据(内容)分离而产生的，它可以生成特定格式的文档，用于网站的模板引擎就会生成一个标准的HTML文档。
模板引擎的分类
- 置换型的模板引擎
就是将规定好的文本标记替换为目标内容。这种模板引擎实现简单，除了标签替换之外，很少支持诸如子模板引用、流程控制等功能。置换型模板引擎通常于业务逻辑不是很复杂的项目，比如生成短信、生成电子邮件，甚至有很多代码生成器也在用它。可以说，置换型模板引擎的思想是整个模板引擎界的基础。
- 解释型模板引擎
解释型模板引擎的原理还是标记置换。只不过有了解释器的存在，可以支持更加复杂的标记和语法。
- 编译型模板引擎
它通过解析引擎和一系列的算法将我们定义的模板转换为页面文件，然后直接访问页面文件即可。
JSP的相关概念
JSP的概念
Java Server Page(Java服务器端页面技术，无视了低耦合的要求，但是这也是它的优势所在)，是Sun公司指定的一种服务器端动态页面生成技术的规范；
springboot中JSP的配置
#设置tomcat端口号server.port=9999#设置jsp的访问目录spring.mvc.view.prefix=/WEB-INF/jsp/#设置jsp文件以什么后缀结尾spring.mvc.view.suffix=.jsp
JSP的结构
HTML标签+JAVA代码，即在HTML页面中嵌入java代码；
JSP的几种写法
- Java代码片段：
<%java代码片段;%> - Java代码表达式：
<%=java代码表达式%> - Java方法：
<%!java的方法%>
三大指令
Page指令：
-
import：用于导包的，可以一次性导入多个包，中间用逗号隔开，也可以使用多次page指令来进行导包； -
pageEncoding：告诉JSP引擎，JSP文件保存的时候应该采用的编码格式； -
contentType：等价于reponse.setContentType()； -
errorPage：指向错误处理页面(需要你手动书写错误页面)； -
isErrorPage：可以写true/false，即定义这个页面是否是错误页面，默认是false；注意，这个属性和上面errorPage属性一般是成对出现的，成对并不是指在一个页面都出现。而是指关联着出现。 -
session：可以写true/false，默认为true，即表示当前页面是否支持session； -
isELIgored：可以写true/false，表示这个JSP是否支持EL表达式,默认为true；
include指令：
这个指令里面最主要的属性是file，用来表示这个页面要包含哪个页面。
taglib指令：
Taglib指令是定义一个标签库以及其自定义标签的前缀。
九大对象
| 隐含对象 | 类型 | 说明 |
|---|---|---|
| request | HttpServletRequest | 代表请求对象 |
| response | HttpServletResponse | 代表响应对象 |
| out | JSPWriter | 输出的数据流 |
| session | HttpSession | 会话 |
| application | ServletContext | 全局的Servlet上下文 |
| pageContext | PageContext | JSP页面上下文 |
| page | Object | 代表JSP页面本身，即this |
| config | Servlet Config | Servlet配置对象 |
| exception | Throwable | 捕获的页面异常对象 |
七大动作
jsp:include：在页面被请求的时候引入一个文件。jsp:useBean：寻找或者实例化一个JavaBean。jsp:setProperty：设置JavaBean的属性。jsp:getProperty：输出某个JavaBean的属性。jsp:forward：把请求转到一个新的页面。jsp:plugin：根据浏览器类型为Java插件生成OBJECT或EMBED标记。
JSTL介绍
JSTL的概念
JSP标准标签库（JSTL）是一个JSP标签集合，它封装了JSP应用的通用核心功能。JSTL支持通用的、结构化的任务，比如迭代，条件判断，XML文件操作，国际化标签，SQL标签。除了这些，还提供了一个框架来使集成JSTL的自定义标签。
JSTL的分类
- 核心标签库：导入方式：
<%@ taglib prefix="c" url="http://java.sun.com/jsp/jstl/core"%>
| 标签名称 | 作用 |
|---|---|
<c:out> | 用于在JSP中显示数据，就像<%= … > |
<c:set> | 用于保存数据 |
<c:remove> | 用于删除数据 |
<c:catch> | 用来处理产生错误的异常状况，并且将错误信息储存起来 |
<c:if> | 与我们在一般程序中用的if一样 |
<c:choose> | 本身只当做<c:when>和<c:otherwise>的父标签 |
<c:when> | <c:choose>的子标签，用来判断条件是否成立 |
<c:otherwise> | <c:choose>的子标签，接在<c:when>标签后，当<c:when>标签判断为false时被执行 |
<c:forEach> | 用户代替java代码for循环语句 |
<c:forTokens> | 用户迭代操作String字符 |
<c:param> | 给请求路径添加参数 |
<c:url> | 重写url，在请求路径添加sessionid,使用可选的查询参数来创造一个URL |
<c:import> | 检索一个绝对或相对 URL，然后将其内容暴露给页面 |
<c:redirect> | 用于将当前的访问请求转发或重定向到其他资源 |
EL介绍
EL的概念
expression language，主要用来简化JSP中的表达式的代码，可以很方便的以标签的形式来代替jsp中的部分java代码，以提高打码的可读性。语法：${el语法}。
| 类别 | 标识符 | 描述 |
|---|---|---|
| JSP | pageContext | 当前页面 |
| 作用域 | pageScope | 访问在页面范围内的变量 |
| requestScope | 访问在请求的 | |
| sessionScope | 访问会话 | |
| applicationScope | 访问应用范围内的变量 | |
| 请求参数 | param | param对象用于获取请求参数的值 |
| paramValues | 当一个请求参数名对应多个值时 | |
| 请求头 | header | 按名称存储请求头 |
| headerValues | 按请求头的所有值作为String数组存储 | |
| Cookie | cookie | 按名称存储请求附带的cookie |
| 初始化参数 | initParam | 按名称存储Web应用程序上下文初始化参数 |
FreeMarker
FreeMarker是一个模板引擎，是一种基于模板和动态数据，并用来生成输出文本(HTML网页，电子邮件，配置文件，源代码等)的通用工具。它不是面向最终用户的，而是一个Java类库是一款程序员可以嵌入他们所开发产品的组件。
中文官方文档：http://freemarker.foofun.cn/toc.html
FreeMarker的特点
- 彻底的分离表现层和业务逻辑。
- 性能好，提高了开发效率。
- 使得开发过程中的人员分工更加明确。
- 学习成本低。
- 支持表达式、宏定义（类似jsp标签）。
FreeMarker的基本语法
数据类型
- 标量：标量是最基本，最简单的数值类型，类似于java中的基本数据类型
- 容器：这些值存在的目的是为了包含其他变量，类似于java中的框架
- 子程序：
- 方法和函数
- 用户自定义指令
比较运算符
>(gt)：大于号，推荐使用gt<(lt)：小于号，推荐使用lt>=(gte)：推荐使用gte<=(lte)- 与java不同freemarker中=和== 一样
空值运算符
-
??：判断是否为空<#if object.attribute??></#if>：这将检查对象的属性是否不为null；<#if(object.attribute)??></#if>：这将检查对象或属性是否不为null；
-
!：指定缺失变量的默认值，如果不指定则默认值是空字符串、长度为0的序列或者长度为0的Map对象。${aaa!}：如果aaa变量没定义，不报错，默认没有任何输出；${aaa!'-'}：如果aaa变量没定义，为空的话，就默认设置该表达式的值为横杠，这里不会为aaa变量赋值${(user.name)!"默认值"}：如果user或name为null，就输出默认值${user.name!"默认值"}：如果user为null会报错，如果name为null，就输出默认值
模板中的代码片段
${...}：FreeMarker将会输出真实的值来替换大括号内表达式，这样的表达式被称为interpolation（插值），FreeMarker中的运算也是在该大括号中进行；- 注释：注释和HTML的注释也很相似，但是使用
<#--and-->来标识。不像HTML注释那样，FTL注释不会出现在输出中(不出现在访问者的页面中)，因为FreeMarker会跳过它们。 - FTL标签(FreeMarker Template Language)：FTL标签和HTML标签有一些相似之处，但是他们是FreeMarker的指令，是不会在输出中打印的。这些标签的名字以**#**开头。(用户自定义的FTL标签则需要使用@来代替#)
FreeMarker入门
- 构建一个maven项目(默认模板)
- 导入FreeMarker依赖(maven仓库中)
- 在maven项目的resource目录下构建一个templates目录
- 在templates目录下构建一个welcome的ftl文件并且书写简单的模板内容
- 在src下新建一个package，并且书写加载ftl并且转换其他文件的类
- 构建配置类
- 设置模板存放路径
- 构建数据库模型
- 加载模板文件
- 生成Writer输出流
- 输出文件
- 关流
什么是页面静态化
静态页面
- 静态网页的内容稳定，页面加载速度快。
- 静态网页没有数据库支持，在网站制作和维护方面的工作量较大。
- 静态网页的交互性差，有很大的局限性。
适用场景：
- 高并发、要求用户响应速度快（泛指3s内）。
- 适用于大规模且数据变化不太频繁的页面。
动态网页
- 交互性好。
- 动态网页的信息都需要从数据库中读取，每打开一个页面就需要去获取一次数据库，如果访问人数很多，也就会对服务器增加很大的荷载，从而影响这个网站的运行速度。
内建函数
所谓的内建函数，就是由语法规定存在的函数。这些函数，包含在编译器的运行时库中，程序员不必单独书写代码实现它，只需要调用即可，他们的实现，由该编译器对应的厂商完成。
简单地说，就是不需要引入任何外部资源就可以使用的函数。（可在官方文档查看具体使用方法）
共同特点：都是书写在**?**后面的；都能实现某个功能函数。
Thymeleaf
官方文档：https://www.thymeleaf.org
Thymeleaf是⾯向Web和独⽴环境的现代服务器端Java模板引擎，能够处 理HTML，XML，JavaScript，CSS甚⾄纯⽂本。
Thymeleaf旨在提供⼀个优雅的、⾼度可维护的创建模板的⽅式。 为了实现这⼀⽬标，Thymeleaf建⽴在⾃然模板的概念上，将其逻辑注⼊到模板⽂件中，不会影响模板设计原型。 这改善了设计的沟通，弥合了设计和开发团队之间的差距。 做到了页面和展示的分离。
Thymeleaf从设计之初就遵循Web标准——特别是HTML5标准 ，如果需要，Thymeleaf允许您创建完全符合HTML5验证标准的模板。
Spring Boot体系内推荐使用Thymeleaf作为前端页面模板，并且Spring Boot 2.0中默认使用Thymeleaf 3.0，性能大幅度提升
Thymeleaf的特点
- Thymeleaf在不管是否连接服务器的环境下皆可运行，即它可以让美工在浏览器查看页面的静态效果，也可以让程序员在服务器查看带数据的动态页面效果。
- Thymeleaf开箱即用的特性。它支持标准方言和Spring方言，可以直接套用模板实现JSTL、OGNL表达式效果，避免每天套模板、改JSTL、改标签的困扰。同时开发人员也可以扩展和创建自定义的方言。但是也导致了没有一个标准的语言模板，显得比较杂乱。
- Thymeleaf提供Spring标准方言和一个与SpringMVC完美集成的可选模板，可以快速地实现表单绑定、属性编辑器、国际化等功能。
Thymeleaf的表达式语法
-
${...}变量表达式：也叫OGNL表达式或者Spring EL表达式，用于调用各种属性和方法- 可以获取对象的属性和方法
- 可以使用
ctx,vars,locale,request,reponse,session,servletContext内置对象 - 可以使用
dates,numbers,strings,objects,arrays,lists,sets,maps等内置方法
-
@{...}链接表达式：不管是静态资源的引用，form表单的请求，凡是链接都可以用@{...}- 无参：
@{/xxx} - 有参：
@{/xxx(k1=v1,k2=v2)}，对应url结构：xxx?k1=v1&k2=v2 - 引入本地资源：
@{/项目本地的资源路径} - 引入外部资源：
@{/webjars/资源在jar包中的路径}webjar网站：www.webjar.org
- 无参：
-
#{...}消息表达式： 用于从消息源中提取消息内容实现国际化- 语法和变量表达式相比多了个获取参数的方式；
- 消息源主要是properties文件
-
{...} 代码块表达式：把某一段定义好的代码块插入到另外一个页面中，一般用于定义出一套通用的header或者footer- 语法：
~{tmplatenmae::fragmentname}或者~{tmplatenmae::#id}，如果省略templatename，它将在当前页面寻找指定的代码块，注意：~{}可以省略- templatename：模板名，定义模板的写法：
<footer th:fragment="copy"> - fragmentname：片段名，引入模板的写法：
<div th:insert="comm/foot::copy"> - id： HTML的id选择器，使用时要在前面加上#号，不支持class选择器
- templatename：模板名，定义模板的写法：
- 代码块表达式需要配合th属性
(th:insert,th:replace,th:include)一起使用。th:insert：将代码块片段整个插入到使用了th:insert的HTML标签中，th:replace：将代码块片段整个替换使用了th:replace的HTML标签中，th:include：将代码块片段包含的内容插入到使用了th:include的HTML标签中，
- 语法：
-
*{...}：选择变量表达式：是另一种类似${...}，在某些时候，两者是等价的，选择变量表达式在执行时是在选择的对象上求解(使用th:object来选择对象)，而${...}是在上下文的变量Map上求解。- 两者获取对象里属性的方式
- 两者进行混用的条件
Thymeleaf中的基础对象
#ctx,#vars：上下文对象(一般用#ctx)#locale：区域对象#requst：(仅Web环境可用)HttpServletRequest对象#response：(仅Web环境可用)HttpServletResponse对象#session：(仅Web环境可用)HttpSession对象#servletContext：(仅Web环境可用)ServletContext对象param：获取请求的参数session：访问session属性application：获取应用程序/servlet上下文
注意： 以上三个不带#的对象，都拥有以下方法：size(),isEmpty,containsKey(),.key()
Thymeleaf中的内联标签
body内的内联
th属性和内联标签的对应关系：
[[...]]等价于th:text(结果将被HTML转义)[(...)]等价于th:utext(结果不会执行HTML转义)
js里的内联
-
在JavaScript中使用内联标签(默认不支持)：
- 在script标签上引入对内联的支持：
<script type="text/javascript"th:inline="javascript"> - 在script标签里书写[[]]、[()]来获取后端数据；
- 在script标签上引入对内联的支持：
-
在JavaScript中实现前后端分离(也称之为JavaScript自然模板)：
- Thymeleaf的目标就是希望前后端分离，即同一个Html文件前端人员以静态原型的方式打开时，看到的是它们的内容，而后端人员通过服务器打开时，看到的是动态数据；
- 直接在数据上使用js注释即可实现前后端分离：
var msg=/*[[${name}]]*/'666666'; - 当在服务器打开该页面时，就会展示
${name}的值，当在静态打开时，就展示666666
-
在JavaScript中自动进行对象序列化：
- JavaScript内联的一个重要的特性是，内联表达式的计算结果不限于字符串，它能自动的将后台的数据库序列化为javascript对象
js中开启内联标签模式只能在Html文件内部的JavaScript代码，不能在引入的外部JavaScript文件中进行操作；
css里的内联
-
在CSS中使用内联标签(默认不支持)：
- 在style标签上引入对内联的支持：
<style th:inline="css"> - 在style标签里书写[[]]、[()]来获取后端数据；
- 在style标签上引入对内联的支持：
-
在CSS中实现前后端分离(也称之为CSS自然模板)：
- 与内联JavaScript一样，CSS内联也允许
<style>标签可以静态和动态地工作，即通过在注释中包含内联表达式作为CSS自然模板。 - 当服务器动态打开时，字体颜色为黄色；当以原型静态打开时，显示是红色，因为Thymeleaf会自动忽略掉CSS注释之后和分号之前的代码。
- 在CSS中，因为CSS自然模板的问题，所以不能在css中像以前一样添加注释，因为Thymeleaf会将它们当作模板进行处理。
- 与内联JavaScript一样，CSS内联也允许
在style标签上引入对内联的支持：<style th:inline="css">
-
在style标签里书写[[]]、[()]来获取后端数据；
-
在CSS中实现前后端分离(也称之为CSS自然模板)：
- 与内联JavaScript一样，CSS内联也允许
<style>标签可以静态和动态地工作，即通过在注释中包含内联表达式作为CSS自然模板。 - 当服务器动态打开时，字体颜色为黄色；当以原型静态打开时，显示是红色，因为Thymeleaf会自动忽略掉CSS注释之后和分号之前的代码。
- 在CSS中，因为CSS自然模板的问题，所以不能在css中像以前一样添加注释，因为Thymeleaf会将它们当作模板进行处理。
与内联JavaScript一样，内联CSS同样只能Html内嵌的
<style>标签中进行使用，不能在外部关联的CSS文件中进行使用 - 与内联JavaScript一样，CSS内联也允许
转载地址：http://imugn.baihongyu.com/