标题 | JavaScript页面模板库handlebars的简单用法 |
范文 | 本文主要是给大家分享的一个javascript页面模板库Handlebars的简单用法,可以帮助大家轻松的构建语义化模板,非常的实用,推荐给大家。 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> <h1>{{title}}</h1> <div>{{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,希望大家能够喜欢。 |
随便看 |
|
在线学习网范文大全提供好词好句、学习总结、工作总结、演讲稿等写作素材及范文模板,是学习及工作的有利工具。