Handlebars : 官网
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<title>老程</title>
<meta name='viewport' content='width=device-width, initial-scale=1'>
<script src="https://cdn.jsdelivr.net/npm/handlebars@latest/dist/handlebars.js"></script>
</head>
<body>
</body>
<script type="text/x-handlebars-template" id="tpl">
<div class="demo">
<h1>{{name}}</h1>
<p>{{content}}</p>
<p>each:</p>
{{#each something}}
<p>
<span>{{saying}}</span>
<span style="margin-left:8px">————{{author}}</span>
</p>
{{/each}}
</div>
</script>
<script type="text/javascript">
var params = {
something: [{
author: '尤大',
saying: '弄了个Vue'
},
{
author: '乔帮主',
saying: '弄了个pc杀手'
}],
name: '城南花已开',
content: '————三亩地'
}; //要插入模板的参数数据
var template = document.getElementById('tpl').innerHTML;
console.log('模板内容：', template);
var fuc = Handlebars.compile(template); //使用handlebars对转换后的html字符串进行编译，f是函数
var element = fuc(params);
console.log('转换后内容：', element);
let div = document.createElement('DIV')
div.innerHTML = element
document.body.appendChild(div)
</script>
</html>
SUCCESS !
760
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
