字符串还可以这样玩

37 阅读1分钟
var tpl = ['{{name}}',
            '<p>我来自{{address}}</p>',
            '<p>这是我的个人博客</p>',
        ].join("");

        var data = {
            name: "<h1>你好</h1>",
            address: '湖北襄阳'
        }
        var html = tpl.replace(/{{name}}/, data.name).replace(/{{address}}/, data.address);
        document.body.innerHTML = html

这像什么,模板赋值啊,忽然发现一个新大陆,有意思 现在我把它改进了下

var tpl = ['{{name}}',
            '<p>我来自{{address}}</p>',
            '<p>这是我的个人博客</p>',
        ].join("");

        var data = {
            name: "<h1>你好</h1>",
            address: '湖北襄阳'
        }
        function htmlTpl(tpl,data){
            return tpl.replace(/{{(\w+)}}/g,function(){
                return data[arguments[1]];
            });

        }
        // var html = tpl.replace(/{{name}}/, data.name).replace(/{{address}}/, data.address);
        document.body.innerHTML = htmlTpl(tpl,data)

顺便说一下,正则的确是很好的工具,有了正则,思路又开阔了些 预览一下