<!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. spring boot 分布式事务实现（XA方式）

    关于spring boot 支持分布式事务,XA是常用的一种方式. 这里把相关的配置记下,方便以后使用. 首先配置两个不同的数据源 : 订单库.持仓库. /** * Created by zhangj ...

  2. 在ajax请求后台时在请求标头RequestHeader加token

    情景:为了保证系统数据的安全性,一般前后台之间的数据访问会有授权与验证,这里的Token机制相对于Cookie支持跨域访问,在RESTful API里面,验证一般可以使用POST请求来通过验证,使服务 ...

  3. js 获取格林尼治时间戳

    昨天在一论坛里看到有朋友问 js 如何获取格林尼治时间戳.不少朋友第一反应是 toGMTString ...确实可以得到格林尼治时间,但不是时间戳.虽然我也没有啥好的方法一步到位的获取,不过至少是获取 ...

  4. 控制台console对象常用的一些方法

    console.log():调试中最常用的方法,用于在控制台窗口显示信息. console.log(123); console.warn():输出信息时,在最前面加一个黄色三角,表示警告 consol ...

  5. linq中let关键字学习

    linq中let关键字就是对子查询的一个别名,let子句用于在查询中添加一个新的局部变量,使其在后面的查询中可见. linq中let关键字实例 1.传统下的子查询与LET关键字的区别     C# 代 ...

  6. Maven 环境的配置

    Maven 环境的配置 现在Java新架构的不断出现,例如Struts,Spring,Hibernate等,项目的配置文件的增多,给开发人员带来很大麻烦.在实际的开发当中,Myeclipse中的pro ...

  7. 视觉中的经典图像特征小结(一): 颜色直方图, HOG, LBP

    [普兒原创, 如有错误和纰漏欢迎指正. 更新中...] 1. 颜色直方图 颜色空间在本质上是定义在某种坐标系统下的子空间,空间中的每一个坐标表示一种不同的颜色.颜色空间的目的在于给出某种颜色标准,使得 ...

  8. hdu GuGuFishtion 6390 数论 欧拉函数

    题目:http://acm.hdu.edu.cn/showproblem.php?pid=6390 直接开始证明: 我们设…………………………………….....…...............………… ...

  9. windows常用设置

    1.截图   A.QQ打开,ctrl + Alt + A   B. cmd 输入  截图工具 2.录制windows操作步骤    命令行输入:psr.exe

  10. 【SVN】SVN的trunk、branches、tag的使用以及分支的概念

    SVN命令参考:   https://www.cnblogs.com/wlsxmhz/p/5775393.html svn的存储结构一般建议在根目录下建立trunk.branches.tags这三个文 ...