handlebars.min.js的使用
Posted konglingxi
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了handlebars.min.js的使用相关的知识，希望对你有一定的参考价值。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> <title>handlebars.min.js的使用</title> </head> <body> <ul id="append_ul"> </ul> </body> <script src="../js/jquery.min.js" type="text/javascript"></script> <script src="../js/handlebars.min.js" type="text/javascript"></script> <!-- 预编译模板 --> <script id="appendTemplate" type="text/x-handlebars-template"> {{description.escaped}} {{example}} <br><br> {{description.unescaped}} {{{example}}} </script> <script type="text/javascript"> $(function(){ // 1.获取模板 var html = $("#appendTemplate").html(); // 2.编译模板 var compile_html = Handlebars.compile(html); // 3.定义数据 var context = { "description": { "escaped": "Using {{}} brackets will result in escaped HTML:", "unescaped": "Using {{{}}} will leave the context as it is:" }, "example": "<button> Hello </button>" }; // 4.传送数据 var append_html = compile_html(context); // 5.追加html $("#append_ul").append(append_html); }); </script> </html>
以上是关于handlebars.min.js的使用的主要内容，如果未能解决你的问题，请参考以下文章