JavaScript頁面模板庫handlebars的簡單用法
更新時間:2015年03月02日 08:52:16 投稿:hebedich
本文主要是給大家分享的一個javascript頁面模板庫Handlebars的簡單用法,可以幫助大家輕松的構建語義化模板,非常的實用,推薦給大家。
Handlebars 是一個 JavaScript 頁面模板庫,幫助你輕松的構建語義化模板。
復制代碼 代碼如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>handlebars</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script src="${base}/js/jquery1.11.min.js"></script>
<script src="${base}/js/handlebars-v3.0.0.js"></script>
</head>
<body>
<div id=tt style='display: none'>
<div class="entry">
<h1>{{title}}</h1>
<div class="body">{{body}}</div>
</div>
</div>
</body>
<script type="text/javascript">
//$('#tt').before('<script id="temp" type="sfd">');
//$('#tt').after("</ script>");//
var source = $("#tt").html();
//alert(source);
var template = Handlebars.compile(source);
var data = {title: "My New Post" , body: "This is my first post!"
};
var result = template(data);//將數(shù)據(jù) 填充到模板
console.log(result);
$('#tt').before(result);
</script>
</html>
示例很簡單,具體詳情可參考ThinkVitamin的文章 Getting Started with Handlebars.js,希望大家能夠喜歡。
您可能感興趣的文章:
- 用javascript實現(xiàn)兼容IE7的類庫 IE7_0_9.zip提供下載
- 一實用的實現(xiàn)table排序的Javascript類庫
- JavaScript 應用類庫代碼
- AppBaseJs 類庫 網(wǎng)上常用的javascript函數(shù)及其他js類庫寫的
- JavaScript類庫D
- Javascript類庫的頂層對象名用戶體驗分析
- stream.js 一個很小、完全獨立的Javascript類庫
- 5個最佳的Javascript日期處理類庫分享
- Moment.js 不容錯過的超棒Javascript日期處理類庫
- javascript面向對象包裝類Class封裝類庫剖析
- javascript拖拽上傳類庫DropzoneJS使用方法
相關文章
javascript間隔定時器(延時定時器)學習 間隔調(diào)用和延時調(diào)用
這篇文章主要介紹了javascript間隔調(diào)用和延時調(diào)用示例,介紹setInterval方法和clearInterval方法的使用方法,大家參考使用吧2014-01-01
原生JS 實現(xiàn)的input輸入時表格過濾操作示例
這篇文章主要介紹了原生JS 實現(xiàn)的input輸入時表格過濾操作,結合實例形式分析了JavaScript基于頁面元素遍歷、運算、判斷實現(xiàn)的表格過濾相關操作技巧,需要的朋友可以參考下2019-08-08
js實現(xiàn)網(wǎng)頁圖片延時加載 提升網(wǎng)頁打開速度
這篇文章主要為大家介紹了js實現(xiàn)網(wǎng)頁圖片延時加載,提升網(wǎng)頁打開速度,感興趣的小伙伴們可以參考一下2016-01-01

