一个简单的模板引擎

var iBox = {
        /**
         * render
         * 取值：<%= variable %>
         * 表达式：<% if {} %>
         * 例子：
         *  <div>
         *    <div class="weui-mask"></div>
         *    <div class="weui-dialog">
         *    <% if(typeof title === 'string'){ %>
         *           <div class="weui-dialog__hd"><strong class="weui-dialog__title"><%=title%></strong></div>
         *    <% } %>
         *    <div class="weui-dialog__bd"><%=content%></div>
         *    <div class="weui-dialog__ft">
         *    <% for(var i = 0; i < buttons.length; i++){ %>
         *        <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_<%=buttons[i]['type']%>"><%=buttons[i]['label']%></a>
         *    <% } %>
         *    </div>
         *    </div>
         *  </div>
         * A very simple template engine
         * @param {String} tpl
         * @param {Object=} data
         * @returns {String}
         */
        render: function (tpl, data) {
            var code = 'var p=[];with(this){p.push(\'' +
                tpl
                    .replace(/[\r\t\n]/g, ' ')
                    .split('<%').join('\t')
                    .replace(/((^|%>)[^\t]*)'/g, '$1\r')
                    .replace(/\t=(.*?)%>/g, '\',$1,\'')
                    .split('\t').join('\');')
                    .split('%>').join('p.push(\'')
                    .split('\r').join('\\\'')
                + '\');}return p.join(\'\');';
            return new Function(code).apply(data);
        }
    };

使用实例：

<script type="text/template" id="billListTpl">
    <%
    for(var i=0; i<discoveredList.length; i++) {
        var item = discoveredList[i];
    %>
    <a class="weui-cell" href="javascript:;"
       data-state="<%=helper.stateFormat(item.status)%>"
       data-status="<%=item.status%>"
       data-orderNo="<%=item.orderNo%>"
       data-bankName="<%=item.bankName%>"
       data-tradeAmount="<%=item.tradeAmount%>"
       data-tradeTime="<%=item.tradeTime%>"
            >
        <div class="weui-cell__bd">
            <div class="title"><%=item.bankName%></div>
            <p class="desc"><%=item.tradeTime%></p>
        </div>
        <div class="weui-cell__ft">
            <div class="title">+<%=helper.tradeAmountFormat(item.tradeAmount)%>元</div>
            <p class="status"><%=helper.statusFormat(item.status)%></p>
        </div>
    </a>
    <% } %>
</script>

billListTpl = $("#billListTpl").text()

$container.empty().html(iBox.render(billListTpl, $.extend({helper:helper}, resp)));