JavaScript输入邮箱自动提示实例代码(2)

// var html = ice("tpl",{
    //     trs: trs,
    //     href: "http://images.jb51.net/type4.jpg"
    // },{
    //     title: function(){
    //         return "<p>这是使用视图helper输出的代码片断</p>"
    //     }
    // });
    var elem = document.getElementById('tpl');
    var tpl = elem.innerHTML;

var html = ice(tpl,{
        trs: trs,
        href: "http://images.jb51.net/type4.jpg"
    },{
        title: function(){
            return "<p>这是使用视图helper输出的代码片断</p>"
        }
    });
    console.log(html);
    $("#content").html(html);

</script>
</html>


简单的实现:

复制代码 代码如下:


(function (win) {

// 模板引擎路由函数
    var ice = function (id, content) {
        return ice[
            typeof content === 'object' ? 'render' : 'compile'
        ].apply(ice, arguments);
    };


    ice.version = '1.0.0';

// 模板配置
    var iConfig = {
        openTag  : '<%',
        closeTag : '%>'
    };


    var isNewEngine = !!String.prototype.trim;

// 模板缓存
    var iCache = ice.cache = {};

// 辅助函数
    var iHelper = {
        include : function (id, data) {
            return iRender(id, data);
        },
        print : function (str) {
            return str;
        }
    };

// 原型继承
    var iExtend = Object.create || function (object) {
        function Fn () {};
        Fn.prototype = object;
        return new Fn;
    };

// 模板编译
    var iCompile = ice.compile = function (id, tpl, options) {

var cache = null;

id && (cache = iCache[id]);

if (cache) {
            return cache;
        }

// [id | tpl]
        if (typeof tpl !== 'string') {

var elem = document.getElementById(id);

options = tpl;

if (elem) {
                // [id, options]
                options = tpl;
                tpl = elem.value || elem.innerHTML;

} else {
                //[tpl, options]
                tpl = id;
                id = null;
            }
        }

options = options || {};
        var render  = iParse(tpl, options);

id && (iCache[id] = render);

return render;
    };


    // 模板渲染
    var iRender = ice.render = function (id, data, options) {

return iCompile(id, options)(data);
    };


    var iForEach = Array.prototype.forEach ?
        function(arr, fn) {
            arr.forEach(fn)
        } :
        function(arr, fn) {
            for (var i = 0; i < arr.length; i++) {
                fn(arr[i], i, arr)
            }
        };


    // 模板解析
    var iParse = function (tpl, options) {

var html = [];

var js = [];

var openTag = options.openTag || iConfig['openTag'];

var closeTag = options.closeTag || iConfig['closeTag'];

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wdwygp.html