<!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的使用的更多相关文章

  1. Mvc 之System.Web.Optimization 压缩合并如何让*.min.js 脚本不再压缩

    最近项目中用到了easy ui ,但是在配置BundleConfig 的时候出现了问题,easy ui的脚本jquery.easyui.min.js 压缩后出现各种脚本错误,总是莫名其妙的 i标量错误 ...

  2. html5shiv.js and respond.min.js

    因为用到这两个插件,所以记录下来.. html5shiv:解决ie9以下浏览器对html5新增标签的不识别,并导致CSS不起作用的问题. respond.min:让不支持Css3 Media Quer ...

  3. min.js反压缩

    给个网址自己体会.. http://jsbeautifier.org/ 当需要修改min.js中的代码时,把min.js文件ctrl+c   ctrl+v扔到上面的网页里,点击beautify 即可

  4. 让IE系列支持HTML5的html5shiv.js和respond.min.js

    HTML5越来越成为主流,被广大搜索引擎所使用,但IE对HTML5的支持却常被人唾弃. 解决方案有两种: 1.为网站创建多套模板,通过程序对User-Agent的判断给不同的浏览器用户显示不同的页面, ...

  5. MyEclipse导入jquery-1.8.0.min.js等文件报错的解决方案

    1.选中报错的jquery文件例如"jquery-1.8.0.min.js". 2.右键选择 MyEclipse-->Exclude From Validation . 3. ...

  6. 项目里的jquery.min.js错误

    项目里的jquery.min.js报一系列 - Missing semicolon - Missing semicolon - Missing semicolon - Missing semicolo ...

  7. spring访问静态资源出错，No mapping found for HTTP request with URI xxx/resources/js/jquery.min.js...

    问题:spring访问静态资源出错,No mapping found for HTTP request with URI xxx/resources/js/jquery.min.js... web.x ...

  8. angularjs中 *.min.js.map 404的问题

    初次使用AngularJS,在chrom调试的时候,出现如下问题: GET http://localhost:63342/luosuo/visitor/js/lib/angular-animate.m ...

  9. jquery.validate.min.js 用法方法示例

    页面html 代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...

随机推荐

  1. ideau 2018.1.2安装和使用

    此博文的各安装软件.方法技巧仅供研究使用,请勿用于商业活动.下载.操作后请于24小时内删除.对于使用过程中出现的一切问题.责任.纠纷,概不负责. 1.下载ideau-2018.1.2,点击下载,提取码 ...

  2. 在“安装”阶段发生异常。 System.Security.SecurityException: 未找到源,但未能

    写Windows服务的时候,运行了一下,就是没反应,命令框一闪而过,查了一下异常,大致是题目的那样.原因是因为权限不足.但是在网上搜的方法都不顶用. 解决方法如下: (1)以管理员身份运行CMD: ( ...

  3. Linux quotacheck失败

    我找了多少个帖子才发现解决这个问题的啊...最终还是靠FQ找的这位大佬的文章  http://www.2daygeek.com/quotacheck-error/# 当我在执行quotacheck - ...

  4. 在android手机上通过Html5Plus调用java类。

    关于html5plus的资料参考http://www.html5plus.org/ 最近通过html5做手机app,其中涉及到网络通过,必须采用原生的socket,websocket无法满足要求,ht ...

  5. bzoj千题计划241：bzoj3864: Hero meet devil

    http://www.lydsy.com/JudgeOnline/problem.php?id=3864 题意: 给你一个DNA序列,求有多少个长度为m的DNA序列和给定序列的LCS为0,1,2... ...

  6. HDU 2509 基础Anti-SG NIM

    如果我们规定当局面中所有的单一游戏的SG值为0时,游戏结束,则先手必胜当且仅当:(1)游戏的SG!=0 && 存在单一游戏的SG>1:(2)游戏的SG==0  && ...

  7. ngx_lua_API 指令详解（三）怎样理解 cosocket指令

    参考:https://moonbingbing.gitbooks.io/openresty-best-practices/content/ngx_lua/whats_cosocket.html 春哥演 ...

  8. MYSQL查询重复记录的方法

    select * from hengtu_demandpush a where (a.did,a.mid) in (select did,mid from hengtu_demandpush grou ...

  9. 20155303 2016-2017-2 《Java程序设计》第六周学习总结

    20155303 2016-2017-2 <Java程序设计>第六周学习总结 课堂笔记 高效学习法推荐 看视频学习(2h)→ 以代码为中心看课本,思考运行结果并验证(3h)→ 课后作业验证 ...

  10. HDU 4508 湫湫系列故事——减肥记I （完全背包）

    题意:有n种食物,每种食物可以给湫湫带来一个幸福感a,同时也会给她带来b的卡路里的摄入,然后规定她一天摄入的卡路里的量不能超过m,一共有n种食物,问可以得到的 最大的幸福感是多少? 解题报告:一开始以 ...