带着问题入手:我们做j2ee网站讲究分层,后台有好多方案进行分层处理。那么前台页面是不是也可以分开呢?
关键词:event、事件、http://www.w3.org/TR/DOM-Level-2-Events/events.html
1、 历史遗留问题
(1) 通常页面的写法
一个页面一般包括有:html代码、CSS代码、JS代码。CSS代码我们都可以将其写入CSS文件中,JS代码也可以写在js文件中。
但有一点通常我们是没有做到的,那就是定义在htmlElement中的事件,都是嵌在html代码中的,例如:
或者是下面这种方式(引入js文件):
Click.js代码:
function info(){ alert("提示"); }
html代码:
<span οnclick="info();">弹出提示</span>
第二种方法会比第一种方式要好一点,总结一下:
a.代码结构比较清晰,可读性强;
b.易于书写,用IDE(aptana)去书写纯JS文件,纠错能力比较好,也会有很好的代码提示功能;
c.利于firebug调试。
(2) 老方法的缺陷
从上面的代码可以看出,如果我想在click事件中增加处理函数,我们只能在info函数中添加代码或者直接修改span中的onclick内容。修改形式如下:
第一种方式:
function info(){
alert("提示");
}
function other(){
.…..
}
<span οnclick="info();other();">弹出提示</span>
第二种方式:
function info(){
alert("提示");
other();
}
function other(){
.…..
}
<span οnclick="info();">弹出提示</span>
上面这2种方式,我认为都不是很好的处理方式,第一种方式需要修改html内部代码;第二种方式是破坏原来的js
文件中的函数实现。都是比较危险的操作,不是同一个人维护这些代码的时候修改的风险比较大。