在這一篇文章中，將會介紹滑鼠座標、元素座標以及滑鼠在指定元素內的座標。
獲取的座標可分為2種：
1) mouseevent.screenx、mouseevent.screeny：基於螢幕的x、y座標；以螢幕的左上角為0,0起始點。
2) mouseevent.clientx、mouseevent.clienty：基於body的x、y座標；以當前body的左上角為0,0起始點，若body含有水平滾動條或垂直滾動條時，左上角還是0,0座標點。
元素的getboundingclientrect()方法可獲取乙個clientrect物件，其描述了元素的方位和寬高等資訊。
屬性名稱
屬性說明
width
元素的寬度
height
元素的高度
left
元素左上角距離當前可視body的寬度
top元素左上角距離當前可視body的高度
right
元素右下角距離當前可視body的寬度；right = left + width
bottom
元素右下角距離當前可視body的高度；bottom = top + height
除了這些直接屬性外，還可以結合其他元素獲取更詳細的座標：
1) 元素左上角在整體body的水平座標= document.body.scrollleft + element.getboundingclientrect().left;
2) 元素左上角在整體body的垂直座標= document.body.scrolltop + element.getboundingclientrect().top;
通過之前學到的獲取滑鼠座標和元素座標後，還可進一步獲取滑鼠在元素內的座標。
以滑鼠在元素內的x座標為例，等於滑鼠的 clientx 減去 元素的getboundingclientrect()放的left，最後在加上元素的scrollleft的值。
公式如下：
web開發之路系列文章
獲取html元素的座標
獲取相對於頁面的座標 x e.offsetleft p e.offsetparent while p do x x p.offsetleft p p.offsetparent end return x y e.offsettop p e.offsetparent while p do y y p.o...
vue 滑鼠座標
方法介紹 關於js滑鼠事件獲取到座標的屬性總共以下五種 event.clientx y event.pagex y event.offsetx y event.layerx y event.screenx y clientx y clientx y獲取到的是觸發點相對瀏覽器可視區域左上角距離，不隨頁...
根據滑鼠座標取該座標下的元素，包括touch
根據座標獲取元素的方法 document.elementfrompoint pagex，pagey 或者document.elementfrompoint clientx，clienty 如果是pc瀏覽器監聽滑鼠事件，可以一直使用event物件獲取座標值 如果是平板，監聽的是touchstart,t...