效果图:(随便找了张美女图片- -)
Paste_Image.png
<div id="app"></div>
<script id="tpl" type="text/template">
<h1>{{name}}</h1>
<p>{{ age }}</p>
<img src="{{img}}" alt="{{ alt }}" width="300">
</script>
<script src="http://cdn.bootcss.com/jquery/2.2.1/jquery.min.js"></script>
<script>
(function($) {
var tmp = '';
var template = $.trim($('#tpl').html());
tmp = template.replace(/{{(|\s)name(|\s)}}/, 'zhangsan')
.replace(/{{(|\s)age(|\s)}}/, 23)
.replace(/{{(|\s)img(|\s)}}/, 'http://c.hiphotos.baidu.com/image/pic/item/79f0f736afc37931180c5620e9c4b74543a91156.jpg')
.replace(/{{(|\s)alt(|\s)}}/, '美女图片');
$('#app').append(tmp);
console.log(template);
})(jQuery);
</script>
网友评论