thymeleaf和artTemplate
Company最近项目中使用了两个模板引擎,分别是Java服务器端的模板引擎Thymeleaf和前端的模板引擎artTemplate,
其实对于这两个模板引擎 理论上应该是不应该放在一起记录的,但是but刚好是同时了接和学习了这两个模板引擎,就
刚好同时放在一起同时记录一下,因为两个模板引擎中所对应的语法使用,~~~~~~好了,反正就是简单记录一下了!,先不说那么多了,开始!
Thymelaf,后端的jar等配置先暂且不提,主要先记录一些语法的使用。。
首先:Thymeleaf是一个后端的服务器引擎,好处是:易于实现前后端的数据显示分离等,
而art-Template则是前端的模板引擎,作用和好处则是:将以前通过字符串拼接再用js,append填充数据到html的方式,更改为另外一种,便于阅读,代码优雅,以及性能操作更快的模板引擎。art-Template的高性能的基本实现原理如该链接即可:(http://blog.csdn.net/qq635785620/article/details/29595931?readlog)
首先使用:Thymeleaf时需要先在html页面引入: <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
所对应的头文件th标签,表名该页面为Thymeleaf模板引擎可管理的页面,除此之外在这里有一个必须要记住的是(不管是使用Thymeleaf引擎还是art-Template引擎,对于HTML页面标签的书写,语法一定要规范,规范,规范,</>标签关闭等语法一定要规范,)thy通过dom读取指定文件为xml的形式,这个操作则肯定是对html标签语法一定规范则不提了,而且art通过编译后将数据展示到页面,如果标签语法不规范的话则也是会出现错误的,好了这点不提了继续过。
然后Thy在标签使用时:是通过指定所对应的th:属性的方式来展示数据的,
1.简单表达式:<input type="text" value="abc" th:value="${user.name}"/>,则表示引用user对象中的name属性,
2.*号表达式:
<div th:object="${session.user}">
<span th:text=" *{name} ">name</span>
</div>
*号表达式一般跟在th:object后,表示直接取该object中的属性值
下面的一些网址对于th的使用包括field表单绑定等都有较为清晰的介绍等
简书网址:对于th:include的使用讲解,较为详细;
http://www.jianshu.com/p/ed9d47f92e37
对于th:标签的使用较为详细(以及也有部分th:field绑定list集合对象元素时的使用)
http://www.cnblogs.com/hjwublog/p/5051732.html
对于th:标签使用较为详细:
http://www.cnblogs.com/vinphy/p/4674247.html
对于th:each讲解较为详细:
http://blog.csdn.net/sun_jy2011/article/details/40710429
对于th:的另外讲解,且直接搜索each对th:each也有很好的讲解(默认情况下为th:each=" obj,objStat:${objList} ")objStat为循环状态变量,默认没有定义时,则为“变量名+Stat”的形式;
http://www.blogjava.net/bjwulin/articles/395185.html
而对于JS的模板引擎art-Template则为:
其实art的使用相对来说也没什么,相比较一些例子使用的话,会简单很多
如:
http://blog.csdn.net/jiazimo/article/details/39232425
http://www.cnblogs.com/shiyou00/p/6841801.html
http://www.jianshu.com/p/e7f3d0c93ed3
http://www.jianshu.com/p/483fa7f6f55b
关于{{include}}关于模板嵌套包含的连接:
http://www.cnblogs.com/ningyanbo/p/4615186.html
deng,
thymeleaf和artTemplate的更多相关文章
- spring boot(四):thymeleaf使用详解
在上篇文章springboot(二):web综合开发中简单介绍了一下thymeleaf,这篇文章将更加全面详细的介绍thymeleaf的使用.thymeleaf 是新一代的模板引擎,在spring4. ...
- 性能卓越的js模板引擎--artTemplate
artTemplate能够将数据与View视图的分离,充分利用 javascript 引擎特性,使得其性能无论在前端还是后端都有极其出色的表现. 在 chrome 下渲染效率测试中分别是知名引擎 Mu ...
- JavaScript模板引擎artTemplate.js——结语
再次首先感谢模板的作者大神,再次放出github的地址:artTemplate性能卓越的js模板引擎 然后感谢博客园的一位前辈,他写的handlebars.js模板引擎教程,对我提供了很大的帮助,也是 ...
- 【JavaScript】ArtTemplate个人的使用体验。
据说ArtTemplate是腾讯的,感觉这东西真不错,使用方便,用起来很简单,哈哈.腾讯也不完全只是坑爹啊. ArtTemplate 使用是,正常引入js,这个自然不用说.这东西啥时候使用呢?我觉得这 ...
- Thymeleaf
1.在html顶部添加 <html xmlns:th="http://www.thymeleaf.org"> 2.url表达式 @{...} <link rel= ...
- Thymeleaf 模板的使用
Thymeleaf是现代化服务器端的Java模板引擎,不同与JSP和FreeMarker,Thymeleaf的语法更加接近HTML,并且也有不错的扩展性.详细资料可以浏览官网.本文主要介绍Thymel ...
- JS 模板引擎 BaiduTemplate 和 ArtTemplate 对比及应用
最近做项目用了JS模板引擎渲染HTML,JS模板引擎是在去年做项目是了解到的,但一直没有用,只停留在了解层面,直到这次做项目才用到,JS模板引擎用了两个 BaiduTemplate 和 ArtTemp ...
- artTemplate模板引擎学习实战
在我的一篇关于智能搜索框异步加载数据的文章中,有博友给我留言,认为我手写字符串拼接效率过低,容易出错.在经过一段时间的摸索和学习之后,发现现在拼接字符串的方法都不在是自己去书写了,而是使用Javasc ...
- JavaScript模板引擎artTemplate.js——两种方法实现性别的判定
template.helper(name, callback) name:必传,辅助事件的名称. callback:必传,辅助事件的回调函数. return:undefined 所谓的辅助事件,主要用 ...
随机推荐
- 文件操作,Io流。
private void textBox1_TextChanged(object sender, EventArgs e) { } private void button1_Click(object ...
- (转载)最近总是遇到各种 IEbug,mark一下,学习到了,转载出处:http://www.cnblogs.com/ruomeng/p/5332814.html
本文分享下我在项目中积累的IE8+兼容性问题的解决方法.根据我的实践经验,如果你在写HTML/CSS时候是按照W3C推荐的方式写的,然后下面的几点都关注过,那么基本上很大一部分IE8+兼容性问题都OK ...
- Android Theme.Dialog 到光 AppCompatDialog
我用在我的 style.xml 作为主要应用程序主题 <style name="AppTheme" parent="Theme.AppCompat.Light&qu ...
- 在前台引用JSON对象
<script type="text/javascript" src="js/jquery-1.11.0.min.js"></script&g ...
- js 双向绑定
//双向绑定实例 <input name="" ng-bind-123="name" /> function DataBinder( object_ ...
- 机器学习之 PCA (二)
参考 http://www.cnblogs.com/frombeijingwithlove/p/5931872.html
- 转过来的Xpath语法
XPath 是XML的查询语言,和SQL的角色很类似.以下面XML为例,介绍XPath 的语法. <?xml version="1.0" encoding="I ...
- 一个batch如何通过一个网络
一个batch下所有的图片一起经过整个网络,不是说一张图片经过网络后再让下一张进入网络,这样一个batch一起通过网络计算速度比一张一张这样快
- xheditor的实例程序—类似word的编辑器
编辑器工具栏:类似word的编辑器 1.1.下载,兼容性 xhEditor官方网站地址为:http://xheditor.com/,打开右上角的免费下载 | 参数向导链接,即可找到最新版本的下载地址. ...
- XML解析(二) SAX解析
XML解析之SAX解析: SAX解析器:SAXParser类同DOM一样也在javax.xml.parsers包下,此类的实例可以从 SAXParserFactory.newSAXParser() 方 ...