詳解javascript事件綁定使用方法

由於html是從上到下加載的，通常我們如果在head部分引入javascript文件，那麼我們都會在javascript的開頭添加window.onload事件，防止在文檔問加載完成時進行DOM操作所出現的錯誤。如果有多個javascript文件，那麼極有可能出現多個window.onload事件，但最後起作用的只有一個，這時候就需要使用事件綁定來解決這個問題了。

IE方式
attachEvent(事件名稱, 函數)，綁定事件處理函數
detachEvent(事件名稱, 函數)，解除綁定

DOM方式
addEventListener(,函數, 捕獲事件
move函數, 捕獲)

這段js程式碼，運行結果是彈出b，因為有兩個oBtn的點擊事件，但是只執行了最後一個，這時候就體現出事件綁定的重要性了。

當你使用事件綁定的時候，那麼兩次點擊事件都會執行，只是執行順序在不同瀏覽器是不同的。在IE中是自下而上執行，而在其他瀏覽器中是自上而下，不過由於alert的特殊性我們可以看出差別，其他語句基本上等同於沒有差別，但是在對於一些對時間要求嚴格是事件的使用時還是需要注意的，例如之前有一篇文章圖片輪播中的setInterval對時間的細微的差別最後導致滾動混亂。 基於原生javascript的圖片輪播domo

最後將我們的程式碼整理成函數，便於之後的使用

function myAddEvent(obj, ev, fn)
{
  if(obj.attachEvent)
  {
    obj.attachEvent('on'+ev, fn);
  }
  else
  {
    obj.addEventListener(ev, fn, false);
  }
}

這時候如果需要使用多個window.onload事件其實就和使用多個oBtn.onclick事件差不多了。如下呼叫函數即可。

myAddEvent(window,'load',function ()
{
  alert('a');
});
myAddEvent(window,'load',function ()
{
  alert('b');