js-template

Javascript Template

javascript 模板函数分享
/*****
模板字符串,格式为或,或
完全遵循javascript语法,内置输出函数为echo(string);函数
常用调用例子,可以用 如果下方法.
js_template(document.getElementById(‘template_code’).value,{names:[‘tom’,’jerry’,’david’]});
返回模板结合给定数据的结果字符串。
作者:浮山狼
邮箱:fushanlang@gmail.com
若使用中遇到问题,欢迎交流、切磋!
*/

function js_template(template_string, values_container) {

    var eval_result = "";
    /**模板输出结果**/

    //公共的输出函数
    var echo = function (output) {
        eval_result += output;
    }

    //产生随机数,为建立唯一临时分隔做铺垫
    var randNum = function () {
        var rnd = {};
        rnd.today = new Date();
        rnd.seed = rnd.today.getTime();
        rnd.seed = (rnd.seed * 9301 + 49297) % 233280;
        return rnd.seed / (233280.0);
    }
    var split_str = '_{' + randNum() + '}_';
    /*唯一分隔标志字符串*/

    /*消除换行符*/
    var eval_str = template_string.replace(/\n|\r|\t/g, "");

    /*匹配第一个标签,并将其转为第二个标签形式*/
    eval_str = eval_str.replace(/<\?js(.*?)\?>/g, function ($0, $1) {
        return "" + $1 + "<\/js>";
    });
    eval_str = eval_str.replace(/<js(.*?)\?>/g, function ($0, $1) {
        return "" + $1 + "<\/js>";
    });

    var eval_str_js_array = new Array();
    /*匹配第二个标签 ...--并且返回唯一分隔串,并将匹配的js代码放入eval_str_js_array中备用*/
    eval_str = eval_str.replace(/(.*?)<\/js>/g, function ($0, $1) {
        eval_str_js_array.push($1);
        return split_str;
    });

    /*用唯一分隔标志串分隔得到普通非js串的数组*/
    var eval_str_array = eval_str.split(split_str);
    eval_str = "";
    /**0101010---0为eval_str_array[]元素,1为eval_str_js_array---重新连接为eval_str消除单引号,双引号引起的问题。**/
    for (var i = 0; i < eval_str_js_array.length; ++i) {
        eval_str += 'echo(eval_str_array[' + i + ']);';
        eval_str += eval_str_js_array[i];

    }
    eval_str += 'echo(eval_str_array[' + eval_str_js_array.length + ']);';

    try {
        /*遍历模板变量容器,并重新建立变量*/
        if (values_container) {
            for (var i in values_container) {
                eval('var ' + i + ' =values_container[i];');
            }
        }
        /**执行总的js字符串得到处理结果**/
        eval(eval_str);
        var error_flag = false;
    }
    catch (error) {
        error_flag = true;
    } finally {
        return eval_result;
    }
}

Leave a Reply

 

 

 

You can use these HTML tags

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Protected by WP Anti Spam