Posted in Javascript onMarch 02, 2015
Handlebars 是一个 JavaScript 页面模板库,帮助你轻松的构建语义化模板。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>handlebars</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script src="${base}/js/jquery1.11.min.js"></script> <script src="${base}/js/handlebars-v3.0.0.js"></script> </head> <body> <div id=tt style='display: none'> <div class="entry"> <h1>{{title}}</h1> <div class="body">{{body}}</div> </div> </div> </body> <script type="text/javascript"> //$('#tt').before('<script id="temp" type="sfd">'); //$('#tt').after("</ script>");// var source = $("#tt").html(); //alert(source); var template = Handlebars.compile(source); var data = {title: "My New Post" , body: "This is my first post!" }; var result = template(data);//将数据 填充到模板 console.log(result); $('#tt').before(result); </script> </html>
示例很简单,具体详情可参考ThinkVitamin的文章 Getting Started with Handlebars.js,希望大家能够喜欢。
JavaScript页面模板库handlebars的简单用法
- Author -
hebedich声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@