js模板引擎实例一

2021-05-22 11:29

阅读:416

标签:模板   www.   html   inner   style   tor   模板引擎   tle   引擎   

   div class="header">div>

    script type="template" id="template">
        h2>
            a href="{{href}}">{{Title}}/a>
        /h2>
        img src="{{imgSrc}}" width="300">
    script>
//        数据
        var data = [{
            Title: "百度一下",
            href: "http://www.baidu.com",
            imgSrc: "1.jpg"
        }];
var template = document.querySelector(‘#template‘).innerHTML,
            header = document.querySelector(‘.header‘),
            fragment = ‘‘;
        for (var i = 0, len = data.length; i ) {
            fragment += template
                .replace(/\{\{Title\}\}/, data[i].Title)
                .replace(/\{\{href\}\}/, data[i].href)
                .replace(/\{\{imgSrc\}\}/, data[i].imgSrc)
        }
        header.innerHTML=fragment;

 

js模板引擎实例一

标签:模板   www.   html   inner   style   tor   模板引擎   tle   引擎   

原文地址:http://www.cnblogs.com/caoruichun/p/7691789.html


评论


亲,登录后才可以留言!