今天的目标是实现javascrīpt动作与html的分离，换句话说就是把onclick之类的属性赋值放到html的外面去。这样做的好处不仅仅是使
页面清晰，功能分离，更重要的，对于那些禁用Javascrīpt的浏览器来说，不会造成Error的出现（虽然很多时候功能还是不能实现，那是因为分离
js仅仅是确保访问性的第一步）。
那么我们应该怎么做呢，直接在js里面这样写吗：
document.getElementById("ELEMENT_ID").onclick = FUNCTION_NAME();
这是不能实现的，我过去一直不明白为什么它不能正常运转，在做VeryFTP的界面的时候，就苦于此而造成VeryFTP的页面里到处都是难看的onclick。那么现在来解决这个问题，究竟为什么呢？
其实很简单，直接将这句写在js里，它将在js载入时被执行。而我们现在大多都有这样的好习惯——将<scrīpt src=...一句写在head里，那么这句执行的时候，DOM还是不完整的，整个body都没有载入，那么又何来getElementById呢？
为
了解决这个问题，理所当然地需要一个事件。我起初一直以为自己熟悉的window.onload事件实在页面刚一载入时触发，但是我错了，这个事件被触发
的时间是文档载入之后，以前曾经隐约有一个ondocumentready的印象，其实就是window.onload吧。所以当初WG的驿站因为
GoogleAD打不开而造成整个网站无法载入的问题恰可以用这个事件来解决问题，虽然往里面append脚本可能还有一点问题，但至少是可能的。（WG
别怪我哈，我当初是年幼无知哈，哈哈）
于是这样写：
window.onload = function(){
addEvent();
}
function addEvent(){
document.getElementById("ELEMENT_ID").onclick = FUNCTION_NAME();
}
这样就OK了吗？呵呵，没有结束呢。我发现这样写，刷新页面之后居然提示我添加信息完成！！（我页面的功能）。数据库里也多了好几行空白。不过这次问题好找，我几乎一眼就看出来了，呵呵。改成这样
window.onload = function(){
addEvent();
}
function addEvent(){
document.getElementById("ELEMENT_ID").onclick = "FUNCTION_NAME();";
}
在
DOM中一切属性都是字符串。刷新，很自然地，函数没有在载入后就被自动执行。但是问题又出来了，点击按钮居然没有用了！！上帝啊，用Frefox自带的
DOM查看器查看呢，按钮上果然没有onclick这一属性。那么IE呢，IE中功能已经实现了，用IE的Develop
Bar查看DOM，果然onclick属性已经被加上去了。
这样，问题就简单了，Firefox要求我们换一种更加规范的方法为它添加这个属性，而IE也是遵守这种规范的，那我们还犹豫什么：
window.onload = function(){
addEvent();
}
function addEvent(){
document.getElementById("ELEMENT_ID").setAttribute("onclick","FUNCTION_NAME();");
}
这样就没有问题了，刷新Firefox，重新打开DOM查看器，这个属性已经上去了，运转正常。
分离JS和HTML的方法终于理清了。