WEB开发网
开发学院网页设计JavaScript 通过MVC模式将Web视图和逻辑代码分离 阅读

通过MVC模式将Web视图和逻辑代码分离

 2010-09-14 13:10:44 来源:WEB开发网   
核心提示: 最好的可能就是将这些javascript代码从html代码中分离,也许有很多人马上就会想到,通过MVC模式将Web视图和逻辑代码分离(2),将这些javascript放到.js文件中,然后使用<script>标签引用一下就ok了,我们可以将视图(V)看成是描述界面的html、c

最好的可能就是将这些javascript代码从html代码中分离。也许有很多人马上就会想到,将这些javascript放到.js文件中,然后使用<script>标签引用一下就ok了。代码如下:

fun.js文件

function fun1(obj) { ... }
function fun2() {... }
index.html文件
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="fun.js">
</script>
  </head>
  <body>
    <input type="button" value="按钮1 " onclick="fun1(this)"/>
    <input type="button" value="按钮2 " onclick="fun2()"/>
  </body>
</html>

虽然上面的代码从某种程度上达到了视图和逻辑分离的效果。但仍然有着一定的联系。我们可以看到,两个<input>标签的onclick事件不还是引用着fun1和fun2函数吗!其实美工人员是不关心这两个函数到底是做什么的,甚至并不需要知道它们的存在。那么是否有更高的方法呢?答案当然是肯定的,就是通过动态的方式指定onclick事件,而这一切美工人员是完全没有感觉的。

我们在文章的开头提到了MVC模式。其实在客户端也存在着一个MVC体系结构。我们可以将视图(V)看成是描述界面的html、css和javascript代码,而模型(M)可以看成是处理业务逻辑的javascript代码,而控制器(C)就是将这两类代码连接起来的代码(一般也是javascript代码)。

上一页  1 2 3 4 5 6 7  下一页

Tags:通过 MVC 模式

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接