JavaScript模板简介
除(Firefox)自带的XUL模板系统外,还可以使用JavaScript模板,这种方法也可以实现内容格式与结构的分离,但依赖于JavaScript模板引擎通过JavaScript业务逻辑将内容注入到模板中,不需要使用RDF/XML这样的技术
按语法风格
100%基于标准(没有自定义语法)
纯JavaScript(JavaScript函数调用生成HTML)
- JsonML (没有“浏览器端模板”),也可以使用JavaScript的JSON子集
- domMaster 和 nodejs master_texthtml
- Mootools Template Engine (null-tech.com)
纯HTML(使用JavaScript选择器找出正常的HTML,按业务逻辑填充)
- PURE
- mustache (有一些设计逻辑,但语法简单)
- Chain.js (死链接); 这里有说明
- LightningDOM
- Mootools Template Engine (zealdev.wordpress.com)
XSL
- XSLTJS (实现跨浏览器支持的XSL模板)
E4X
- E4X for templating (注意E4X已被废弃)
标准友好的(自定义属性或者语法,但大部分采用标准兼容的用法)
X/HTML/E4X/XUL 自定义属性和元素
- Adobe Spry processing instruction attributes
- ASP.NET client templates
- Seethrough (使用具有名称空间的E4X属性和元素,注意虽然E4X已被废弃)
- XUL Templates (只支持XUL)
纯JavaScript嵌入在HTML/XML设计逻辑(ASP/JSP/PHP或者大括号{}风格)
自定义用法
HTML + 大括号{} 使用自定义的设计逻辑
- ASP.NET 客户端模板
- ExtJS中的模板 (死链接,可通过archive.org获取)
- JavaScriptTemplates
- JSmarty (借鉴与Smarty,有更多功能和近期更新)
- jQSmarty: jQuery Smarty Plugin (死链接) (这里有介绍)
- JS Repeater
- JTemplates
- mjst
- Mjt
- mustache (感谢janl)
- Templates in JQuery
- Templates in Prototype
- Whiskers.js
HTML + 没有名称空间的自定义元素和属性
ASP/JSP风格的自定义逻辑,使用<%…%>
- JavaScript Micro-Templating 语法与(asp|jsp|php)相似
- BetterJavascriptTemplates
- PureJSTemplate
- JSONML Browser-Side Templates
- BabaJS
- Templates in Prototype
按特性
通过元素/节点匹配模板,将整个文档翻译到另一个
XSL
- XSLTJS (跨浏览器使用的XSL模板)
参考文章:http://www.ycoder.com/2013/05/javascript%E6%A8%A1%E6%9D%BF/
版权声明
由 davidzhang创作并维护的 Gowhich博客采用创作共用保留署名-非商业-禁止演绎4.0国际许可证。
本文首发于 博客( https://www.gowhich.com ),版权所有,侵权必究。
本文永久链接: https://www.gowhich.com/blog/218
版权声明
由 davidzhang创作并维护的 Gowhich博客采用创作共用保留署名-非商业-禁止演绎4.0国际许可证。
本文首发于 Gowhich博客( https://www.gowhich.com ),版权所有,侵权必究。
本文永久链接: https://www.gowhich.com/blog/218