zoukankan      html  css  js  c++  java
  • js 模板方法模式

    父类中定义算法骨架,子类中实现和改变一些算法

    例:导航的实现

    //算法骨架
    var formateStr=function (param, data) {
    return param.replace(/{#(w+)#}/g,function (match, key) {
    return typeof data[key]===undefined? "":data[key]
    })
    };
    var Nav=function (data) {
    var _this=this;
    _this.item='<li><a href="{#hrefUrl#}" title="{#title#}" {#sign#}>{#content#}</a></li>';
    _this.html='<ul>';
    for (var i=0,l=data.length;i<l;i++){
    _this.html+=formateStr(_this.item,data[i])
    }
    _this.html+='</ul>';
    return _this.html;
    };

    //基础导航
    var obNav=document.getElementById('nav');
    obNav.innerHTML=Nav([
    {
    hrefUrl : 'http://www.baidu.com',
    content : '百度一下'
    },
    {
    hrefUrl : 'http://www.zhihu.com',
    content : '知乎一下'
    }
    ]);


    //带提示消息的导航
    var infoNav=function (data) {
    var _this=this;
    _this.info='<i>{#num#}</i>';
    for (var i=data.length-1;i>=0;i--){
    data[i].content+=formateStr(_this.info,data[i])
    }
    return Nav.call(this,data)
    };
    var objNav=document.getElementById('nav');
    objNav.innerHTML=infoNav([
    {
    hrefUrl : 'http://www.baidu.com',
    content : '百度一下',
    title : '百度',
    num : '10',
    sign : 'sign="1"'
    },
    {
    hrefUrl : 'http://www.zhihu.com',
    content : '知乎一下',
    title : '知乎',
    num : '10',
    sign : 'sign="2"'
    }
    ]);
  • 相关阅读:
    2015.4.16-C#中ref和out的区别
    2015.4.10-SQL 高级查询(二)
    2015.4.10-C#入门基础(三)
    2015.4.8-C#入门基础(二)
    2015.4.7-C#入门基础(一)
    2015.4.2-SQL 简单语句(一)
    对GridView的某一列行进行操作。。
    jquery获取GridView中RadioButton选中的数据
    Ajax获取前台的数据
    前台验证
  • 原文地址:https://www.cnblogs.com/redn/p/8119419.html
Copyright © 2011-2022 走看看