jQuery模板 :(五) JSRender之编译,注册,获取模板
一、在jsRender中,如果想要创建一个模板,那么需要提供一个template的标记(markup),JsRender会将该标记转换或者编译成一个javascript的函数,即"render"方法。实际上,为了方便我们开发者,JsRender会为我们创建一个template对象,该对象具有一个template.render()方法。
二、有两种方式创建template。
1. 传入一个标记字符串到方法$.templates()中,该方法会将该标记字符串编译成一个template对象,并且选择性地按照该标记字符串名称注册成一个template。
2. 在一个script块中定义一个template,type为type="text/x-jsrender"。在种情况下,JsRender会自动的调用$.templates()方法。
三、相关的实例:
1. 1 根据一个标记字符串名称来创建和注册一个template(从server端获取包含有template标记的script 文件)
<div id="peopleList"></div>
$.getScript("http://www.jsviews.com/samples/resources/templates/person.js", function() { var html = $.render.person(people); $("#peopleList").html(html); }); var people = [ { name: "Adriana" }, { name: "Robert" } ];
1. 2 根据一个标记字符串名称来创建和注册一个template(从server端获取包含有template标记的text文件)
<div id="peopleList"></div>
var personTemplate; $.get("templates/person.txt", function(value) { personTemplate = $.templates(value); var html = personTemplate.render(people); $("#peopleList").html(html); }); var people = [ { name: "Adriana" }, { name: "Robert" } ];
2. 在一个script块中去注册和定义一个template
<div id="peopleList"></div> <script id="personTemplate" type="text/x-jsrender"> <label>Name:</label> {{:name}} </script>
$.templates("personTmpl", "#personTemplate"); var people = [ { name: "Adriana" }, { name: "Robert" } ]; var html = $.render.personTmpl(people); $("#peopleList").html(html);