1. 程式人生 > >事件物件,arguments、事件的相容問題

事件物件,arguments、事件的相容問題

一、事件物件

  1、每個元素身上是天生存在的,不需要我們去定義,只需要我們給這個事件繫結一個方法,當事件觸發的時候,就會執行這個方法

  2、事件繫結的方法:

    (1)、DOM0級繫結:div . onclick=function()  { }

    (2)、DOM2級繫結:div . addEventLister()  ||  div . attachEvent() 

    二者的區別:

      (1)、onclick是這個元素私有的屬性,而addEventLister()是公有的屬性,從EventTarget(事件源)物件上繼承來的

          IE低版本的attchaEvent是公有的

      (2)、div . onclick存在事件冒泡機制,沒有捕獲機制

                                  div . addEventListener()可有冒泡,可有捕獲

           div . attachEvent()只有冒泡機制

    attachEvent()和addEventListener()的區別

    (1)、attachEvent只用在Ie8以下,addEventListener()適合標準瀏覽器

    (2)、attachEvent的事件名帶on,而addEventListener事件名不帶on

    (3)、attachEvent函式裡面的this是window,而addEventListener函式裡面的this是指當前元素物件

    (4)、attachEvent只有冒泡沒有捕獲,addEventListener可有冒泡也可有捕獲

二、Arguments

  每個函式都有一個arguments物件,它是這個函式所有引數構造的集合,它是一個數組

    

       

  上面的控制檯是arguments陣列中有一個元素叫mouseevent;

  所以,每個事件的方法中,瀏覽器都會給它一個引數叫mouseevent。我們所有的滑鼠的訊息都臨時存在這個mouseevent

三、事件的相容問題

  mouseevent有相容性:

    

  Event物件的相容性:

    clientX和clientY是瀏覽器滑鼠到瀏覽器視窗左上角的距離位標

    pageX和pageY是滑鼠到網頁左上角的距離,但是Ie低版本沒有這個屬性

    在Ie怎麼算pageY的值:用clientY+scrollTop

  事件源相容性:

    事件源:點選那個元素,那個元素就是事件源

    標準瀏覽器的事件源是ev . target

    Ie6-8 沒有這個屬性,但是Ie有ev . scrElement

  阻止事件冒泡的相容性:

    event . stoppropagation?event . stoppagation : event.cancelBubble=true;

  阻止事件預設行為的相容性:

    event . prevenDefault?event . prevenDefault : event.returnvalue=false;