首页 > Web开发 > 详细

JS_0037:template 模板引擎使用

时间:2020-08-27 13:13:45      阅读:64      评论:0      收藏:0      [点我收藏+]

 

引入引擎文件  template.js

 

1,定义引擎模块

<script type="text/html" class="card-tpl">
    <!-- 生成案例列表循环 -->
    <%for(var i = 0;i < cards.length; i++){%>
        <div class="card-wrap" name="<%:=cards[i].proAddr%>">
            <img src="<%:=cards[i].img%>"  class="left">
            <span class="card-title">
                <%:=cards[i].title%>
            </span>
            <span class="card-slogen"><%:=cards[i].slogen%></span>
        </div>
    <%}%>
</script>

 

2,读取json数据并赋值生成html标签

    $.get("../data/url.json", function(t) {
        var a = document.getElementsByClassName("card-tpl")[0].innerHTML,
            n = template(a, {
                cards: t.data
            });
        $(".cards-part").append($(n)), 
        bindClickEvt(), 
        loaded()
    })

 

json数据格式

技术分享图片

 

JS_0037:template 模板引擎使用

原文:https://www.cnblogs.com/eliteboy/p/13570622.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!