10 个强大的JavaScript / jQuery 模板引擎推荐
openkk 13年前
<p>模板引擎是为了使用户界面与业务数据（内容）分离而产生的，它可以生成特定格式的文档。由于在开发过程中，网站或应用程序的界面与数据实现分离，大大提升了开发效率，良好的设计也使得代码重用变得更加容易。 <br /> <br /> 本文整理了10 款基于JavaScript和jQuery的模板引擎，希望能对你的开发工作带来一些帮助。 <br /> <br /> <strong>1. NANO</strong> <br /> <br /> 最简单的jQuery模板引擎，完美实现对JSON的解析。 <br /> </p> <div style="text-align:center;"> <img alt="10 个强大的JavaScript / jQuery 模板引擎推荐" src="https://simg.open-open.com/show/32123b866f4bea16d0bccc2efcf1708c.jpg" width="580" height="150" /> </div> <p><br /> <br /> <a href="/misc/goto?guid=4958336549348967134" target="_blank">源码 / 演示</a> <br /> <br /> <strong>2. The “template” binding</strong> <br /> <br /> 该工具通过渲染模板将相关联的DOM元素组织到一起。 <br /> </p> <div style="text-align:center;"> <img alt="10 个强大的JavaScript / jQuery 模板引擎推荐" src="https://simg.open-open.com/show/27b294f4dca7935df411213056367724.jpg" width="580" height="150" /> </div> <p><br /> <br /> <a href="/misc/goto?guid=4958336550175573840" target="_blank">源码</a> / <a href="/misc/goto?guid=4958336550972569049" target="_blank">演示</a> <br /> <br /> <strong>3. JsViews</strong> <br /> <br /> 下一代的jQuery模板，交互式数据驱动视图，建立在JsRender模板的基础上。 <br /> </p> <div style="text-align:center;"> <img alt="10 个强大的JavaScript / jQuery 模板引擎推荐" src="https://simg.open-open.com/show/49610e741215e76b2a154ad1c9ca3518.jpg" width="580" height="150" /> </div> <p><br /> <br /> <a href="/misc/goto?guid=4958336551792472007" target="_blank">源码</a> / <a href="/misc/goto?guid=4958336552589076146" target="_blank">演示</a> <br /> <br /> <strong>4. JsRender</strong> <br /> <br /> 针对高性能和纯字符串渲染进行了优化，无需依赖DOM和jQuery。 <br /> </p> <div style="text-align:center;"> <img alt="10 个强大的JavaScript / jQuery 模板引擎推荐" src="https://simg.open-open.com/show/6c7eec631be2a59d4c283a2579d11cc4.jpg" width="580" height="150" /> </div> <p><br /> <br /> <a href="/misc/goto?guid=4958336553377300374" target="_blank">源码</a> / <a href="/misc/goto?guid=4958336554170554976" target="_blank">演示</a> <br /> <br /> <strong>5. google-jstemplate</strong> <br /> <br /> 针对Ajax Web应用程序的简单、强健的浏览器端模板处理工具。 <br /> </p> <div style="text-align:center;"> <img alt="10 个强大的JavaScript / jQuery 模板引擎推荐" src="https://simg.open-open.com/show/94a6d136cd4539046ccc5f51b29224a9.jpg" width="580" height="150" /> </div> <p><br /> <br /> <a href="/misc/goto?guid=4958336554969435799" target="_blank">源码</a> / <a href="/misc/goto?guid=4958336555768543719" target="_blank">演示</a> <br /> <br /> <strong>6. The jQuery Templates Plugin</strong> <br /> <br /> 一个jQuery模板插件，该插件的开发工作目前处于停滞状态。 <br /> </p> <div style="text-align:center;"> <img alt="10 个强大的JavaScript / jQuery 模板引擎推荐" src="https://simg.open-open.com/show/0a6537cbd41889b9c2ec270dc513f013.jpg" width="580" height="150" /> </div> <p><br /> <br /> <a href="/misc/goto?guid=4958336556563884466" target="_blank">源码</a> / <a href="/misc/goto?guid=4958336557359116925" target="_blank">演示</a> <br /> <br /> <strong>7. jQote2</strong> <br /> <br /> 这是jQote的第2个版本，是基于jQuery的最强大、通用的客户端模板引擎。 <br /> </p> <div style="text-align:center;"> <img alt="10 个强大的JavaScript / jQuery 模板引擎推荐" src="https://simg.open-open.com/show/274185feb16638e1a4eabf914c5c1da7.jpg" width="580" height="150" /> </div> <p><br /> <br /> <a href="/misc/goto?guid=4958336558147368968" target="_blank">源码 / 演示</a> <br /> <br /> <strong>8. kite</strong> <br /> <br /> 这是一个基于JavaScript的模板引擎。 <br /> </p> <div style="text-align:center;"> <img alt="10 个强大的JavaScript / jQuery 模板引擎推荐" src="https://simg.open-open.com/show/57259f59bd9f3260fd1cc385af4ab84a.jpg" width="580" height="150" /> </div> <p><br /> <br /> <a href="/misc/goto?guid=4958336558944040488" target="_blank">源码 / 演示</a> <br /> <br /> <strong>9. mustache.js</strong> <br /> <br /> 基于JavaScript的Logic-less（无逻辑或轻逻辑）模板。 <br /> </p> <div style="text-align:center;"> <img alt="10 个强大的JavaScript / jQuery 模板引擎推荐" src="https://simg.open-open.com/show/f60ca5371b5e26a1f13f11e0a8a08fa5.jpg" width="580" height="150" /> </div> <p><br /> <br /> <a href="/misc/goto?guid=4958336559741344597" target="_blank">源码 / 演示</a> <br /> <br /> <strong>10. Tempo 1.7</strong> <br /> <br /> Tempo是一个微型JSON渲染引擎，允许你使用纯HTML制作数据模板。 <br /> </p> <div style="text-align:center;"> <img alt="10 个强大的JavaScript / jQuery 模板引擎推荐" src="https://simg.open-open.com/show/c6c4cd8754e5fc931f8c542341c28628.jpg" width="580" height="150" /> </div> <p><br /> <br /> <a href="/misc/goto?guid=4958336560536638532" target="_blank">源码</a> / <a href="/misc/goto?guid=4958336561337679382" target="_blank">演示</a> <br /> <br /> 英文原文：<a href="/misc/goto?guid=4958336562135125427" target="_blank">10 JavaScript and jQuery Templates Engines</a><br /> 本文转载自: <a href="/misc/goto?guid=4958336563128238996" rel="nofollow" target="_blank">http://www.iteye.com/news/24827</a></p>