HTML5 | Thymeleaf | Freemarker
文章平均质量分 89
前端那些事 HTML5 | Thymeleaf | Freemarker
流烟默
这个作者很懒,什么都没留下…
展开
-
Thymeleaf - 语法使用详解
可以从官网下载PDF进行参考:https://www.thymeleaf.org/documentation.html或者在线参考文档:https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html一个好的习惯是,每一个HTML页面引入Thymeleaf的名称空间:<html lang=&am原创 2018-06-13 18:11:56 · 7866 阅读 · 0 评论 -
FreeMarker实践总结
【1】FreeMarker 的缓存FreeMarker 的缓存处理主要用于模版文件的缓存。一般来讲,模版文件改动不会很频繁,在一个流量非常大的网站中,如果频繁的读取模版文件对系统的负担还是很重的。因此 FreeMarker 通过将模版文件的内容进行缓存,来降低模版文件读取的频次,降低系统的负载。 当处理某个模版时,FreeMarker直接从缓存中返回对应的 Template 对象,原创 2017-11-27 20:43:16 · 4745 阅读 · 0 评论 -
SpringBoot2.0整合Freemarker
这个暂时没有遇到坑,直接上码实战。【1】pom文件添加freemarker依赖如下:<!--整合freemarker--><dependency> <groupId>org.springframework.boot</groupId> <artifactId&gt原创 2018-08-09 11:21:52 · 2998 阅读 · 0 评论 -
FreeMarker - 内建函数
【1】Sequence的内置函数1.sequence?first 返回sequence的第一个值。 array: ${cityArray?first} list: ${cityList?first} set: ${citySet?first}2.sequence?last 返回sequence的最后一个值。3.sequence?size 返回sequence的大小。...原创 2017-11-27 20:49:02 · 717 阅读 · 0 评论 -
FreeMarker - 常用指令和宏
【1】list、break指令语法格式如下:<#list sequence as item> ...</#list>item_index:当前变量的索引值. item_has_next:是否存在下一个对象.示例如下:<#list ["星期一","星期二","星期三","星期四","星期五","星原创 2017-11-27 21:31:07 · 1453 阅读 · 0 评论 -
Thymeleaf实践总结
【1】页面获取后台model数据背景后台放数据到model中,给页面使用。后台@RequestMapping("/toFace_login.html")public String toFace_login(String username,Model model) { model.addAttribute("username", username); return ...原创 2019-10-26 15:52:29 · 1148 阅读 · 0 评论 -
SpringBoot下thymeleaf使用UEditor
以前传统web工程下使用UEditor是继承ActionEnter实现自己的MyActionEnter来实现自定义文件上传路径的,具体可以参考:UEditor自定义图片/文件上传路径与回显本文主要是SpringBoot+thymeleaf环境下使用UEditor。【2】不指定上传路径① 引入pom依赖<!-- 百度编辑器 --><dependency> <...原创 2020-02-04 15:35:13 · 1422 阅读 · 1 评论 -
FreeMarker - 配置参数用法说明
【1】locale作用:设置默认地区,主要影响数字、日期输出格式,request中没有指定地区时模板查找的值。值:zh_CN,en_US配置实例:prop key="locale">zh_CNprop> 【2】classic_compatible作用:兼容旧版freemarker习惯,不建议使用,可能会导致一些额外的问题。如,include必须用绝原创 2018-01-21 18:21:15 · 4576 阅读 · 0 评论 -
SpringMVC中使用FreeMarker实践
使用RESTful风格,故需要额外注意DispatcherServlet的url-pattern和applicationContext.xml中的配置。 &lt;mvc:default-servlet-handler/&gt;【1】xml配置applicationContext.xml配置:&lt;?xml version="1.0" encoding="UTF-8&qu原创 2017-11-27 21:11:11 · 550 阅读 · 0 评论 -
Thymeleaf - 与SpringBoot整合入门
【1】是什么官网地址 : https://www.thymeleaf.org/Thymeleaf是一个用于Web和独立环境的现代服务器端Java模板引擎。SpringBoot推荐使用Thymeleaf。Thymeleaf is a modern server-side Java template engine for both web and standalone environmen...原创 2018-06-13 17:04:05 · 1185 阅读 · 0 评论 -
FreeMarker - 四种变量的用法
freemarker的变量可以分为四种,分别是数据模型的变量(root中的变量),模板中的变量使用(<#assign>定义的变量),局部变量(在指令中的变量)和循环变量。【1】数据模型的变量直接从模型中给模板传值的变量就是数据模型的变量,它把变量的值放在一个map中,在模板中直接可以用。Java代码: @RequestMapping("/hello") public ModelAndV原创 2017-11-27 20:36:15 · 5619 阅读 · 1 评论 -
JavaScript、ECMAScript、DOM和BOM对象
【1】JavaScriptJavaScript 是一种轻量级的编程语言;是可插入 HTML 页面的编程代码。 JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。ECMA-262 是 JavaScript 标准的官方名称。JavaScript 由 Brendan Eich 发明。它于 1995 年出现在 Netscape 中(该浏览器已停止更新),并于 1997 年被 ECMA原创 2017-06-02 09:04:15 · 1478 阅读 · 0 评论 -
URL编码中的escape、encodeURI和encodeURIComponent
【1】escape和unescapeescape:对字符串进行编码。语法格式:escape(string)该方法不会对 ASCII 字母和数字进行编码,也不会对下面这些 ASCII 标点符号进行编码: * @ - _ + . / 。其他所有的字符都会被转义序列替换。最关键的是,当你需要对URL编码时,请忘记这个方法,这个方法是针对字符串使用的,不适用于URL。unesc原创 2018-01-17 14:25:25 · 1619 阅读 · 0 评论 -
JS中数组的增删改查操作实践总结
首先说明一下js中对象类型: JS函数对象与原型typeof 用来判定目标是什么类型。数组下标,index是从 0开始的。测试数组如下:var arry = [0,1];//number数组var arry1 = ['2','3'];//string 数组var arry2 = ["2","3",true];//string和boolean 数组【1】数组添加index依次增加arry.pu原创 2017-05-03 15:19:40 · 21635 阅读 · 0 评论 -
JS-函数、对象与原型
【1】JS中的值类型与对象以下四种为简单值类型:console.log(typeof(x)); // undefinedconsole.log(typeof(10)); // numberconsole.log(typeof('abc')); // stringconsole.log(typeof(true)); // boolean函数、数组、对象、null 、new Numbe原创 2017-01-10 09:28:30 · 838 阅读 · 0 评论 -
页面加载即执行JQuery的三种方法
【1】$(function( ){ }); $(function(){ $("#name").click(function(){ //adding your code here }); }); 【2】 $(document).ready(function( ){ }) $(document).ready(function(){ $("#name").click原创 2016-12-26 13:58:56 · 61681 阅读 · 0 评论 -
JQuery数组遍历 - $.each(),$().each()和forEach()
【1】$().each(function(){})对于这个方法,在dom处理上面用的较多。如果页面有多个input标签类型为checkbox,对于这时用$().each来处理多个checkbook,例如:$("input[name='ch']").each(function(index){if($(this).attr("checked")==true){ //一些操作代码}回调函数是原创 2016-11-09 15:39:57 · 27022 阅读 · 1 评论 -
AJAX POST请求中参数以form data和request payload形式在servlet中的获取方式
HTTP请求中,如果是get请求,那么表单参数以name=value&amp;name1=value1的形式附到url的后面。 如果是post请求,那么表单参数是在请求体中,也是以name=value&amp;name1=value1的形式在请求体中。通过chrome的开发者工具可以看到如下(这里是可读的形式,不是真正的HTTP请求协议的请求格式)。get请求:RequestURL:http://127.0.0.原创 2017-11-14 09:57:30 · 3536 阅读 · 0 评论 -
window.setTimeout() 和window.setInterval() 的用法与区别
【1】setTimeout定义和用法: setTimeout()方法用于在指定的毫秒数后调用函数或计算表达式。 语法: setTimeout(code,millisec) 参数: code (必需):要调用的函数后要执行的 JavaScript 代码串。millisec(必需):在执行代码前需等待的毫秒数。 提示: setTimeout() 只执行 code 一次。如果要多次调用,请使用原创 2016-12-27 15:36:37 · 2671 阅读 · 1 评论 -
JSP中JSTL标签与指令使用详解
【1】c:foreach<c:forEach>标签用于通用数据循环,它有以下属性|属 性 ——- |描 述——————–|是否必须———–|缺省值items ——-进行循环的项目 ———-否——————–无 begin ——–开始条件——————否—————— 0 end ———-结束条件 ——————否———-集合中的最后一个项目 step ———–步长————原创 2016-12-23 13:54:10 · 1619 阅读 · 0 评论 -
UEditor自定义图片/文件上传路径与回显
本文是基于Windows下Java解决UEditor自定义图片/文件上传路径问题,文件保存在本地磁盘,Tomcat做了虚拟路径映射。UEditor官网:https://ueditor.baidu.com/website/index.html下载地址:https://ueditor.baidu.com/website/download.htmlUEditor入门:http://fex.bai...原创 2019-04-29 16:45:57 · 6511 阅读 · 1 评论 -
CSS实践详解总结
【1】CSS选择器① 类选择器1.后代选择选择父类下面的所有后代。.wrapper-item .layui-form-label{ width: 25%; } <div class="wrapper-item"> <label for="name" class="layui-form-label"> <span class="we-red">*</span>姓名 </label></原创 2021-05-13 13:31:20 · 816 阅读 · 1 评论 -
layui使用实践总结
【1】弹出层子元素获取父页面dom元素值如下所示,点击添加关系数据会弹出子页面,在子页面需要获取父页面的8。假设8对应dom id为orderId,子页面代码示例如下:var text = parent.window.$('#orderId').val();console.log("获取的父页面orderID:"+text);【2】日期时间控件点击闪没有时页面高度不够,会出现点击控件闪现一下就没有了的情况,可以修改代码如下:laydate.render({ elem: '#dead原创 2020-10-01 10:58:05 · 1490 阅读 · 1 评论 -
CSS - 修改输入框placeholder默认颜色
有时为了配合整个页面效果,可能会去修改输入框的placeholder样式。源码示例如下:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style typ原创 2018-02-11 19:42:19 · 3003 阅读 · 0 评论 -
HTML中meta标签中属性详解并设置页面缓存策略
【1】简介 元素可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词。标签位于文档的头部,不包含任何内容。标签的属性定义了与文档相关联的名称/值对。该标签主要有两个属性:http-equiv属性和name属性,不同的属性又有不同的参数值,这些不同的参数值就实现了不同的网页功能。【2】http-equiv属性http-equ原创 2016-11-17 10:46:47 · 6151 阅读 · 1 评论 -
HTML5 - section、article和div
【1】sectionsection是带有语义的标签。W3C中定义:<section> 标签定义文档中的节(section、区段)。比如章节、页眉、页脚或文档中的其他部分。<section> <h1>PRC</h1> <p>The People's Republic of China was born in 1949...</p></section>HTML标准是这样写的:The secti原创 2017-11-28 15:23:05 · 2789 阅读 · 0 评论