indutny / jquery.tpl

jQuery.tpl: Javascript template engine

jQuery.tpl project: simple, fast and powerfull templates for jQuery and javascript (github.com/donnerjack13589/jsTPL).¶ ↑

It’s easy to learn - start now!

Basic examples:¶ ↑

$.template(“1 + 1 = {%= 1+1 %}”) .html(); // 1 + 1 = 2 $.template(“Hello {%= a %}!”,[“a”]) .html({a: ‘World’}); // >> Hello World! $.template(“Hello {%each a%}{%= this %}, {%/each%}world!”,) .html({a: [‘Andy’,‘Alex’]}); // >> Hello Andy, Alex, World! $.template(“{%if godmode%}My Lord!{%else%}Who are you?{%/if%}”,[“godmode”]) .html({godmode: true}); // >> My Lord!

Medium examples:¶ ↑

$.template(“{%catch var a %}What’s up, dude?{%/catch%} {%= a.substr(0,9) %}?”) .html(); // >> What’s up? $.template(“{%~ var a = true; %}{%if !a %}‘a’ is false?{%/if%}”,[“a”]) .html(); // >> ‘a’ is false? $.template(“{%@ name(value) { return ‘~’ + value + ‘~’ } %}{%= name(‘fancy’)%}”) .html() // >>~fancy~

Harder examples:¶ ↑

$.template(“&lt;div&gt;&lt;/div&gt;”)(); // &gt;&gt; jQuery object of “div” $.template(“<div></div>”,[],“name”); // Store this template by “name” $.template(“name”)(); // &gt;&gt; jQuery object of “div” again $.template(“<button>{%= value%}</button>”,,“input”); $.template(“{%: input {value:‘Hello world!’} %}”)(); // &gt;&gt; Button with text “Hello world!” $.template(“{%catch var temp%}<button>{%= value%}</button>{%/catch%}\ {%= $(temp).click(function(){alert(msg)}) %}”,[“value”,“msg”],“input”); $.template(“{%: input {value:‘Hello world!’, msg: ‘Alarm!’} %}”)(); // >> Button with text “Hello world!” and alerting “Alarm!” on click

Block module¶ ↑

$.template(“&lt;div&gt;Hello, {%block ‘username’%}{%/block%}!&lt;/div&gt;”,[],“block”); $.template(“{%extends ‘block’%}{%block ‘username’%}Admin{%/block%}”)().html(); // >> Hello, Admin!