arttemplate

一、先在html中,写好要复用的模板:javascript

<li>
	<img src="{{favcoverUrl}}" />
	<div>
		<p>{{favtitle}}</p>
		<p>
			<span>{{favbestPrice}}</span>
			<a href="../../course/detail.html?productId={{productId}}">去报名</a>
		</p>
	</div>
</li>

!要赋值的地方,用 “ {{}} ” 包起来html

二、在js中添加引用:java

//AMD规范
require(['plugins/zepto', 'common/template',], function ($,tpl) {
    //在这里假设data为接口返回的数组数据,实际项目中,有调用接口,这里省略
    var pos, oneData, html = '';
    for(pos in data){
        oneData = data[pos];
        html += tpl('模板html路径', {
            //赋值
            favtitle: oneData.title,
			favcoverUrl: oneData.cover_url,
			favbestPrice: oneData.best_price,
			productId:oneData._id
        });
    }
    $('#id').append(html); //在页面中插入这一个模板
});
相关文章
相关标签/搜索