js知識點總結

event表明事件的狀態，例如觸發event對象的元素，鼠標的位置及狀態，按下的鍵等等。

event對象只能事件發生的過程當中纔有效。

event的某些屬性只對特定的事件有意義。好比，fromElement和toElement屬性只對onmouseover和onmouseout事件有意義。

event屬性：altKey,button,cancelBubble,clientX,clientY,shiftKey, srcElement, srcFilter, toElement, type, x, y

1.【鼠標相關】

咱們常常須要求出當前鼠標的座標位置，這時就會用到諸如如下的內容：

• clientX，clientY:相對於客戶區域的x，y座標位置，不包括滾動條，就是正文區域。
• offsetx，offsetY：設置或者是獲得鼠標相對於目標事件的父元素的內邊界在x，y座標上的位置。
• screenX，screenY: 相對於用戶屏幕的x，y座標位置。
• x，y:設置或者是獲得鼠標相對於目標事件的父元素的外邊界在x，y座標上的位置。

2.【特殊按鍵的判斷】

判斷鍵盤上的特殊按鍵是否被按下：

• ALT鍵：event.altKey: true 爲關閉，false 爲不關閉。
• CTRL鍵：event.ctrlKey: true 爲關閉，false 爲不關閉。
• SHIFT鍵：event.shiftKey: true 爲關閉，false 爲不關閉。
• 鼠標鍵：event.button: 0-沒按鍵 1-按左鍵 2-按右鍵 3-按左右鍵 4-按中間鍵 5-按左鍵和中間鍵 6-按右鍵和中間鍵 7-按全部的鍵。
• 通常按鍵：keyCode：設置或檢索與引起事件的關鍵字相關聯的Unicode關鍵字代碼，該屬性與onkeydown   onkeyup   onkeypress一塊兒使用，若是沒有引起事件的關鍵字，則該值爲0。

  3.【應用實例】

  
  
   4.clientX 
  描述： 
  返回鼠標在窗口客戶區域中的X座標。 
  
  語法： 
  event.clientX 
  
  註釋： 
  這是個只讀屬性。這意味着，你只能經過它來獲得鼠標的當前位置，卻不能用它來更改鼠標的位置。 
  
  5.clientY 
  描述： 
  返回鼠標在窗口客戶區域中的Y座標。 
  
  語法： 
  event.clientY 
  
  註釋： 
  這是個只讀屬性。這意味着，你只能經過它來獲得鼠標的當前位置，卻不能用它來更改鼠標的位置。 
  
  
  
  
  
  
  
  例子： 
  下面的例子經過使用 onpropertychange 事件，彈出一個對話框，顯示 propertyName 的值。2.returnValue 
  描述： 
  設置或檢查從事件中返回的值 
  
  語法： 
  event.returnValue[ = Boolean] 
  
  可能的值： 
  true 事件中的值被返回 
  false 源對象上事件的默認操做被取消 
  
  例子見本文的開頭。 
  
  13.screenX 
  描述： 
  檢測鼠標相對於用戶屏幕的水平位置 
  
  語法： 
  event.screenX 
  
  註釋： 
  這是個只讀屬性。這意味着，你只能經過它來獲得鼠標的當前位置，卻不能用它來更改鼠標的位置。 
  
  14.screenY 
  描述： 
  檢測鼠標相對於用戶屏幕的垂直位置 
  
  語法： 
  event.screenY 
  
  註釋： 
  這是個只讀屬性。這意味着，你只能經過它來獲得鼠標的當前位置，卻不能用它來更改鼠標的位置。 
  
  15.shiftKey 
  描述： 
  檢查shift鍵的狀態。 
  
  語法： 
  event.shiftKey 
  
  可能的值： 
  當shift鍵按下時，值爲 TRUE ，不然爲 FALSE 。只讀。 
  
  16.srcElement 
  描述： 
  返回觸發事件的元素。只讀。例子見本文開頭。 
  
  語法： 
  event.srcElement 
  
  17.srcFilter 
  描述： 
  返回觸發 onfilterchange 事件的濾鏡。只讀。 
  
  語法： 
  event.srcFilter 
  
  18.toElement 
  描述： 
  檢測 onmouseover 和 onmouseout 事件發生時，鼠標所進入的元素。 參考：7.fromElement 
  
  語法： 
  event.toElement 
  
  註釋： 
  這是個只讀屬性。 19.type 
  描述： 
  返回事件名。 
  
  語法： 
  event.type 
  
  註釋： 
  返回沒有「on」做爲前綴的事件名，好比，onclick事件返回的type是click 
  只讀。 
  
  20. x 
  描述： 
  返回鼠標相對於css屬性中有position屬性的上級元素的x軸座標。若是沒有css屬性中有position屬性的上級元素，默認以BODY元素做爲參考對象。 
  
  語法： 
  event.x 
  
  註釋： 
  若是事件觸發後，鼠標移出窗口外，則返回的值爲 -1 
  這是個只讀屬性。這意味着，你只能經過它來獲得鼠標的當前位置，卻不能用它來更改鼠標的位置。 
  
  21. y 
  描述： 
  返回鼠標相對於css屬性中有position屬性的上級元素的y軸座標。若是沒有css屬性中有position屬性的上級元素，默認以BODY元素做爲參考對象。 
  
  語法： 
  event.y 
  
  註釋： 
  若是事件觸發後，鼠標移出窗口外，則返回的值爲 -1 
  這是個只讀屬性。這意味着，你只能經過它來獲得鼠標的當前位置，卻不能用它來更改鼠標的位置。