更详细的内容请参见:http://nej.netease.com/course/topic/template/
NEJ的模块化开发的全称为基于模板的模块化开发,所以可以看到模板是模块化开发的基础。
NEJ模板系统非常注重效率。模板在添加的时候,不会解析。在初次使用的时候,模板才会被解析,并且将解析结果缓存起来以备后续使用。
基本模板
基本模板就是我们通常所说的客户端结构模板,包括Text模板、Node模板、JST模板、Item模板。这些模板提供了html、dom以及页面逻辑的缓存。 开发人员使用这些模板,可以在用户操作时,便利地展示页面结构(初始不可见的);可以在异步数据返回时,便利地拼装数据与页面结构,展示给用户。
text模板
text模板提供了基本的文本缓存功能, 模板标示符为txt。开发人员可以使用这个模板来缓存html结构,但是一般情况下开发人员比较少使用Text模板,而是使用功能更强大的Item模板或JST模板。
nej.e._$addTextTemplate
nej.e._$getTextTemplate
实例展示:http://runjs.cn/code/icqzwgm3
node模板
Node模板提供了基本的节点缓存功能,模板标示符为ntp。开发人员可以使用这个模板来缓存DOM节点,但是一般情况下开发人员不会直接使用Node模板,而是使用Item模板。在使用Item模板时,使用Node模板来生成节点。
nej.e._$addNodeTemplate
实例:http://runjs.cn/code/giatvahh
item模板
Item模板提供了(节点+逻辑)缓存功能,非常适合带有逻辑的列表项的开发。Item模板一般使用Node模板来获取节点。
实例展示:http://runjs.cn/code/c7kav8qs
JST模板
JST模板是基于模板生成文本输出的通用工具,模板标示符为jst。JST的语法类似于freemaker。开发人员一般使用JST来合并数据与html结构。
实例展示:http://runjs.cn/code/mfqzzlem
扩展模板
CSS模板
CSS模板提供了CSS文件延迟加载以及CSS代码段延迟生效功能, 模板标示符为css。CSS模板是通过通用接口nej.e._$parseTemplate来调用。
实例展示:http://runjs.cn/code/sqivrbcm
JS模板
JS模板提供了js文件延迟加载以及js代码段延迟生效功能, 模板标示符为js。JS模板是通过通用接口nej.e._$parseTemplate来调用。
范例
需求: 在用户的某个操作后,a.js、b.js才会被加载,一段js代码段会生效。 下面是用JS模板实现以上需求的html、js代码:
实例展示:http://runjs.cn/code/iymavjto
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。