MVC模式:模型(model)-视图(view)-控制器(controller),将业务逻辑、数据、视图分离
$(function(){
var MVC = MVC || {}; //初始化mvc对象
MVC.model = function(){ //初始化mvc数据模型层
var M = {}; //内部数据对象
M.data = {};//服务器端获取的数据
M.conf = {};//配置数据,页面加载时即提供
return {
getData: function(m){ return M.data[m]; }, //根据字段获取服务器端数据
getConf: function(c){ return M.conf[c]; }, //根据字段获取配置数据
//设置服务器端数据,获取服务器端异步获取的数据,更新数据
setData: function(m,v){ M.data[m]=v;return this;},
//页面中的某些操作,更新配置数据
setConf: function(c,v){ M.conf[c]=v;return this;}
}
}();
MVC.view = function(){ //初始化mvc视图层
var M = MVC.model;
//内部视图创建方法对象,页面渲染等
var V = {
//比如这里可以写一个方法,根据M.data的数据创建html模板并append进相应dom
};
//根据视图名称返回视图
return function(v){
V[v]();
}
}();
MVC.ctrl = function(){ //初始化mvc控制器层
//对M和V的引用
var M = MVC.model;
var V = MVC.view;
//控制器创建方法对象
var C = {
a: function(){
V(); //渲染模板
//下面可以添加一些事件与交互
}
};
//遍历执行,如果少的话也可以直接执行
for(var i in C){
C[i] && C[i]();
}
//或 C.a();
}();
})
林秀栋的技术博客