一直想写个js模板，现在终于写了个简单的版本，后续会增加更多功能(依赖jquery)

var Template = function(){
	this.params = {};
	this.htmlTemp = '';
	this.containerId = '';
}

Template.prototype = {
    setTempByHtml:function(html){
        this.htmlTemp = html;
    },
    setTempById:function(id) {
        this.htmlTemp = $("#"+id).html();
        this.containerId = id;
    },
    setContainerId:function(id) {
      this.containerId = id;  
    },
    setParams:function(params){
        this.params = params;
    },
    parseGlobalHtml:function(){
        //全局
        var globalReg = /<\!\-\-\global\:\{([^\}]+)\}\-\->/ig;
        this.htmlTemp = this.htmlTemp.replace(globalReg,function(reged,param,position){
            if(this.params[param]){
                return this.params[param];
            } else {
                console.warn('没有找到参数:'+param);
                return '';
            }
        }.bind(this));
    },
    /**
     * 准备用来作内嵌的循环
     * */
    parseLoopHtml:function(params){
        
    },
    getHtml:function() {
        this.parseGlobalHtml();
        
        //循环
        var loopReg = /<\!\-\-\loop\:\{([^\}]+)\}\-\->/ig;
        
        var loopStarts = [];
        while(loop = loopReg.exec(this.htmlTemp)) {
            
            loopStarts.push({
                'position':loop['index']+loop[0].length,
                'param':loop[1],
                'tagLength':loop[0].length
            });
        }
        
        //循环结束
        var endReg = /<\!\-\-\end\-\->/ig;
        var loopEnds = [];
        while(end = endReg.exec(this.htmlTemp)) {
            loopEnds.push({
                'position':end['index'],
                'tagLength':end[0].length
            });
        }
        var loopc = [];
        var htmls = [];
        for(var i=0;i<loopStarts.length;i++) {
            var sp = loopStarts[i].position;
            var ep = loopEnds[i].position;
            if(i-1<0) {
                htmlStart = 0;
            } else {
                htmlStart = loopEnds[i-1].position+loopEnds[i-1].tagLength;
            }
            
            htmls.push(this.htmlTemp.substring(htmlStart,sp-loopStarts[i].tagLength));
            var content = this.htmlTemp.substring(sp,ep);
            var fieldsReg = /<\!\-\-\{([^\}]+)\}\-\->/ig;
            var listHtml = '';
            
            if(this.params[loopStarts[i]['param']]) {
                for(var j=0;j<this.params[loopStarts[i]['param']].length;j++) {
                    listHtml+= content.replace(fieldsReg,function(reged,param,position){
                        return this.params[loopStarts[i]['param']][j][param];
                    }.bind(this));
                }
            } else {
                console.warn('没有找到参数:'+loopStarts[i]['param']);
            }
            
            loopc.push(listHtml);
        }
        htmls.push(this.htmlTemp.substring(loopEnds[i-1].position+10,this.htmlTemp.length));
        
        var desHtml = '';
        for(var i=0;i<htmls.length;i++) {
            desHtml+=htmls[i];
            if(loopc[i]) {
                desHtml+=loopc[i];
            }
        }
        return desHtml;
    },
    parse:function(){
        $("#"+this.containerId).html(this.getHtml());
    }
}

如何使用呢？很简单

如下

<div id="container">
            <!--global:{cat_name}-->
            <ul>
                <!--loop:{list}-->
                <li><!--{title}-->-<!--{time}--></li>
                <!--end-->
            </ul>
            <!--global:{footer_name}-->
        </div>
        
        <script>
            var t = new Template();
            t.setTempById("container");
            t.setParams({
                'cat_name':'我是个标题',
                'footer_name':'我是尾吧',
                'list':[{
                    'title':'第一行','time':'2013-10-12 9:00:00'
                },{
                    'title':'第二行','time':'2013-10-13 10:00:00'
                },{
                    'title':'第三行','time':'2013-10-14 23:00:00'
                }]
            });
            t.parse();
        </script>