arttemplate模板

84 阅读 0 评论 56 点赞

我是靠谱客的博主整齐故事，最近开发中收集的这篇文章主要介绍arttemplate模板，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src='template.js'></script>
</head>
<body>
<h1>最新上映电影：</h1>
<div id='mydiv'></div>
</body>
</html>
<!--模板王者演示-->
<script id="arttemplate" type="text/html">
<strong>电影名称：</strong>{{name}}<br>
<strong style='color:red'>导演</strong>{{lead}}<br>
<strong style='color:green'>主演:</strong>{{role}}
</script>
<script>
//标准json定义-- 必须有标题，必须有双引号
var film = {
name: "没人鱼",
lead: "周星驰",
role: "邓超",
};
var html = template('arttemplate', film);
document.getElementById('mydiv').innerHTML = html;
// 将模板封装成一个函数
BindTemplate(film,'mydiv','arttemplate')
//封装成一个函数
function BindTemplate(data, divid, Template) {
//alert(divid);
//alert(Template);
var html = template(Template, data);
document.getElementById(divid).innerHTML = html;
}
</script>