無意中看到了一篇關于表現和數據分離的文章轮洋,詳細的看了一下纯命,感覺和自己理解的不太一樣就有了這次的探尋
一代态、什么是表現和數據分離
說法1:表現和數據分離就是MVC,MVC 是將數據和業(yè)務邏輯分離由控制器分發(fā)绒尊,明顯不是
說法2:表現和數據分離就是Css和html+data分離,方便修改頁面的表現形式男图,如模板制作
說法3:表現和數據分離就是javascript中的MVC,將數據的獲取與數據的顯示分離
說法4:表現和數據分離就是javascript控制數據填充甜橱,html負責表現
其中
說法1明顯不符合逊笆,
說法2更應該稱之為表現與結構分離
說法3,下面是研究并復制別人的代碼
$(document).ready(function () {
//定義一個controller
var piliController = {
//選擇視圖
start: function () {
this.view.start();
},
//將用戶操作映射到模型更新上
set: function (name) {
this.model.setPerson(name);
}
};
piliController.model = {
piliKV: {
'葉小釵': '刀狂劍癡',
'一頁書': '百世經綸',
'素還真': '清香白蓮'
},
curPerson: null,
//數據模型負責業(yè)務邏輯和數據存儲
setPerson: function (name) {
this.curPerson = this.piliKV[name] ? name : null;
this.onchange();
},
//通知數據同步更新
onchange: function () {
piliController.view.update();
},
//相應視圖對當前狀態(tài)的查詢
getPiliAction: function () {
return this.curPerson ? this.piliKV[this.curPerson] + this.curPerson : '???';
}
};
piliController.view = {
//用戶觸發(fā)change事件
start: function () {
$('#pili').change(this.onchange);
},
onchange: function () {
piliController.set($('#pili').val());
},
update: function () {
$('#end').html(piliController.model.getPiliAction());
}
};
piliController.start();
});
葉小釵
一頁書
素還真
寫的確實很好的代碼岂傲,個人想法是為什么不將select在用js在view中生成难裆?
說法4 那就是Ajax了,
將3和4兩種結合起來會不會更好一些镊掖。乃戈。。亩进。症虑。。归薛。
筆者QQ群 148042812