当前位置: 代码迷 >> Web前端 >> mustache 事例
  详细解决方案

mustache 事例

热度:570   发布时间:2013-10-19 20:58:22.0
mustache 例子

网上下载mustache-0.7.2.js 其他版本也可以

拷贝如下代码即可运行

<html>

<head>
<script type="text/javascript" src="mustache-0.7.2.js"></script>
<script type="text/javascript">
function change(){

var view = {
  title: "Joe",
  calc: function() {
    return 2 + 4;
  },

//只有对象才有键值对,数组只是元素是没有键值对的说法

//mustache中只要是键值对的形式  就能取出其值 呈现在页面上

person:[{firstname:"chen","age":20,"country":"china"},
           {firstname:"gao","age":20,"country":"china"}]


}
var template = document.getElementById("test").innerHTML;
var html = Mustache.to_html(template , view);
document.getElementById("test2").innerHTML=html;


}
</script>

</head>
  <body>
    <div id="test" style="display:none">
        {{title}} spends {{calc}} hello
        {{#person}}
           {{firstname}} 
        {{/person}}


   </div>
   <div id="test2">my content</div>
    <input type="button" value="button" onclick="change()">
 </body>


</html>
  相关解决方案