<ul>
<li>offsetX/Y
<p>相對于被點擊元素的左上角,即使事件被綁定在父元素身上,那么這個位置也是相對于當前的target對象元素來說</p>
</li>
<li>pageX/Y
<p>相對于文檔document的左上角,即使有滾動條,文檔被滾入一部分不可見,但這個位置依然是相對于文檔來計算,包含的有文檔被滾動條滾動隱藏的不可見部分</p>
</li>
<li>clientX/Y
<p>相對于瀏覽器可視窗口的左上角,但是不包含瀏覽器的導航,頁簽等部分,僅限于瀏覽器展示文檔的可見區域,不包含滾動條隱藏的內容</p>
</li>
<li>screenX/Y
<p>相對于電腦屏幕的左上角,如果是多屏,那么這個位置是相對于主屏幕來計算
</p>
</li>
</ul>
click_event.png
<p>
如圖,事件是綁在粉紅的大div上面,點擊黑點位置(在綠色小div上)
offsetX/Y就是相對于小綠來計算,差不多是(0, 0);
pageX/Y是紅線表示的范圍,因為頁面有豎向滾動條切文檔向上滾動隱藏了一部分,所以y方向上會計算隱藏的距離;
clientX/Y是藍色線條表示的范圍,y方向上不包含瀏覽器書簽,導航欄,頁簽等的距離;
screenX/Y是綠線表示的范圍,到屏幕的距離.
</p>
