js event對象的clientX,offsetX,screenX和pageX的區別

老是會被javascript的event對象的clientX,offsetX,screenX,pageX 弄得頭暈,因而決定作個圖來區分一下(畫得我手那個酸呀。。。。)javascript


先總結下區別:java

event.clientX、event.clientY瀏覽器

鼠標相對於瀏覽器窗口可視區域的X,Y座標(窗口座標),可視區域不包括工具欄和滾動條。IE事件和標準事件都定義了這2個屬性工具

event.pageX、event.pageY對象

相似於event.clientX、event.clientY,但它們使用的是文檔座標而非窗口座標。這2個屬性不是標準屬性,但獲得了普遍支持。IE事件中沒有這2個屬性。事件

event.offsetX、event.offsetYip

鼠標相對於事件源元素(srcElement)的X,Y座標,只有IE事件有這2個屬性,標準事件沒有對應的屬性。文檔

event.screenX、event.screenYget

鼠標相對於用戶顯示器屏幕左上角的X,Y座標。標準事件和IE事件都定義了這2個屬性event

相關文章
相關標籤/搜索