<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<input type="text" id="type"></input>
<p id="p"></p>
<script>
var html={}
//m
html.model ={ content:{
"0":"你好",
"1":"ok",
"2":"大家好",
"3":"你好",
"4":"ok",
"5":"大家好"
},
data:function(id){
if(!(id in this.content)){
var id = 0;
}
return this.content[id]
}
}
//v
html.view={
init:function(value){
document.getElementById("p").innerHTML= value;
},
id:function(){
return document.getElementById("type").value;
}
}
//c
html.controller = { init:function(){
var id = html.view.id(); //获取id
var value = html.model.data(id); //通过id 过滤数据
html.view.init(value); //把数据加载到页面中
}
}
document.getElementById("type").onchange = html.controller.init;
</script>
</body>
</html>

MVCmoduleExample.html的更多相关文章

随机推荐

  1. Mac键盘按键符号

    通过修饰键来查看 像command.option.control.shift这些按键在Mac下叫做修饰键,一般情况下他们大都用来辅助输入或者用作快捷键的修饰键. 打开“系统偏好设置”,点击“键盘→键盘 ...

  2. javascript-浏览器消息提醒

    如何让用户在浏览器最小化的状态下也能及时的收到消息提醒呢? 这个问题作为webRd是要正面面对的. 大约可分两种场景:一种是类似桌面通知的形式还有一种是类似QQ提醒(在系统任务栏闪烁随后高亮);接下来 ...

  3. Java面试集合(二)

    前言 大家好,给大家带来Java面试集合(二)的概述,希望你们喜欢 二 1.请问线程有哪些状态? 新建状态(New) 就绪状态(Runnable) 运行状态(Running) 阻塞状态(Blocked ...

  4. a标签嵌套a标签在实际项目开发中遇到的坑

    大家都知道HTML的嵌套规范,其中一个规范是块元素嵌套行内元素,块元素嵌套块元素,行内元素嵌套行内元素,行内元素不能嵌套块元素. 其中需要注意的是行内元素嵌套行内元素,a标签虽然是行内元素,但是a标签 ...

  5. linux内核中GNU C __attribute__ 机制的实用

    很多东西,只看看是不行的,要想深入的去了解一个东西,一定要去不断地学习,实践,反思. 说白了就是要去打磨. 在linux中,最近遇到了这样一个定义: int board_usb_init(int in ...

  6. Linux - 修改内核启动顺序及删除无用内核

    现象: CentOS7开机启动界面显示多个内核选项 原因: 正常情况下,有两个启动项,一个是"正常启动",另一个是"救援模式启动"(rescue). 如果启动项 ...

  7. 机器学习技法笔记:12 Neural Network

    Roadmap Motivation Neural Network Hypothesis Neural Network Learning Optimization and Regularization ...

  8. 测试工具之Jmeter(各部件简单介绍)

    jmeter可以到官网下载: http://jakarta.apache.org/ 下载后解压即可使用,双击如下文件打开Jmeter界面: $JMETER_HOME\apache-jmeter-3.1 ...

  9. MySQL 中的数字类型

    MySQL 中数据类型常用的就三大类: 数字类型/numeric types 日期和时间/date and time types 字符类型/string (character and byte) ty ...

  10. 获取 BaiduMapSDKDemo SHA1 签名

    用 Android Studio 1.5 运行 BaiduMapsApiASDemo 时,显示 key 验证出错. 原因在于用 keytool -list -keystore debug.keysto ...