<!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. angularJs的继承

    为什么要继承,本来是后端的概念,但是同样适用于前端开发.继承,无疑是将通用的东西抽取出来. 下面介绍的是angular的伪继承,就是说是通过继承scope这个变量来实现的.代码很简单,一行代码就可以. ...

  2. mybatis入门基础----高级映射(一对一，一对多，多对多)

    阅读目录 一:订单商品数据模型 二.一对一查询 三.一对多查询 四.多对多查询 回到顶部 一:订单商品数据模型 1.数据库执行脚本 创建数据库表代码: CREATE TABLE items ( id ...

  3. POJ - 1753 Flip Game（状压枚举）

    https://vjudge.net/problem/POJ-1753 题意 4*4的棋盘,翻转其中的一个棋子,会带动邻接的棋子一起动.现要求把所有棋子都翻成同一种颜色,问最少需要几步. 分析 同一个 ...

  4. Dubbo学习笔记6：Dubbo增强SPI与SPI中扩展点自动包装的实现原理

    在Dubbo整体架构分析中介绍了Dubbo中除了Service和Config层为API外,其他各层均为SPI,为SPI意味着下面各层都是组件化可以被替换的,也就是扩展性比较强,这也是Dubbo比较好的 ...

  5. 关于mysql-connector-java（JDBC驱动）的一些坑

    最近在写一个项目的时候,用了maven仓库里面较新的mysql的JDBC驱动,版本是6.0.6,Mybatis的全局配置是这么写的: <?xml version='1.0' encoding=' ...

  6. [转]Centos 安装Sublime text 3

    本文简单介绍在CentOS上安装Sublime text 3, 转自:Centos 安装Sublime text 3 Step 1 :建立软件安装目录 # mkdir /opt # cd /opt S ...

  7. TC-572-D1L2 （双向搜索+记忆化）

    solution: 这一题是比较难实现的双向搜索题:(字符串+双向搜索+hash记忆化) 我们可以先把K的前半部分枚举出来,并将得出的所有结果和题目给的n个数的每一个数的前半部分都比对一遍,得到它和每 ...

  8. c语言.函数指针数组

    函数指针: 一个指向函数的指针.一般用函数名表示. 函数指针数组:元素为函数指针的数组.转移表.c语言中函数不可以定义为数组,只能通过定义函数指针来操作. #include<stdio.h> ...

  9. Java内存模型-锁的内存语义

    一 引言 在说volatile的内存语义时,讲过这样一句话:想要理解透volatile特性有一个很好的方法,就是把对volatile变量的单个读/写,看成是使用同一个锁对这些单个读/写操作做了同步.所 ...

  10. [Alg::DP] Square Subsequence

    题目如下: #include <iostream> #include <string> #include <vector> using namespace std; ...