1、鼠標事件
clientX 設置或獲取鼠標指針位置相對于瀏覽器內容窗口的 x 坐標，其中客戶區(qū)域不包括窗口自身的控件和滾動條。
clientY 設置或獲取鼠標指針位置相對于瀏覽器內容窗口的 y 坐標，其中客戶區(qū)域不包括窗口自身的控件和滾動條。
(跟screenX相比就是將參照點改成了瀏覽器內容區(qū)域的左上角，該參照點會隨之滾動條的移動而移動，也就是說，他計算left或top時直接忽略了滾動條的高和寬，它的參考點是瀏覽器可見區(qū)域的左上角，而不是頁面本身的body左上角原點，計算數值和滾動條是否滾動沒有關系，只是絕對的計算鼠標點距離瀏覽器內容區(qū)域的左上角的距離，忽略了滾動條的存在)
offsetX 設置或獲取鼠標指針位置相對于觸發(fā)事件的對象的 x 坐標。
offsetY 設置或獲取鼠標指針位置相對于觸發(fā)事件的對象的 y 坐標。
screenX 設置或獲取獲取鼠標指針位置相對于用戶屏幕的 x 坐標。
screenY 設置或獲取鼠標指針位置相對于用戶屏幕的 y 坐標。
pageX：參照點是頁面本身左上角的原點.已經把滾動條滾過的高或寬計算在內.
所以基本可以得出結論：
pageX > clientX, pageY > clientY
pageX = clientX + ScrollLeft(滾動條滾過的水平距離)
pageY = clientY + ScrollTop(滾動條滾過的垂直距離)
2、網頁
網頁可見區(qū)域寬： document.body.clientWidth;
clientLeft: 獲取對象的border寬度
clientTop：獲取對象的border高度
網頁可見區(qū)域高： document.body.clientHeight;
包括padding但不包括border、水平滾動條、margin的元素的高度。對于inline的元素這個屬性一直是0，單位px，只讀元素。
網頁可見區(qū)域高： document.body.offsetHeight (包括邊線的寬);
網頁可見區(qū)域寬： document.body.offsetWidth (包括邊線的寬);
包括padding、border、水平滾動條，但不包括margin的元素的高度。對于inline的元素這個屬性一直是0，單位px，只讀元素。
當本元素的子元素比本元素高且overflow=scroll時，本元素會scroll，這時：scrollHeight: 因為子元素比父元素高，父元素不想被子元素撐的一樣高就顯示出了滾動條，在滾動的過程中本元素有部分被隱藏了，scrollHeight代表包括當前不可見部分的元素的高度。而可見部分的高度其實就是clientHeight，也就是scrollHeight>=clientHeight恒成立。在有滾動條時討論scrollHeight才有意義，在沒有滾動條時scrollHeight==clientHeight恒成立。單位px，只讀元素。
網頁正文全文寬： document.body.scrollWidth
網頁正文全文高： document.body.scrollHeight
網頁被卷去的高： document.body.scrollTop
網頁被卷去的左： document.body.scrollLeft
網頁正文部分上： window.screenTop;
網頁正文部分左： window.screenLeft;{screenLeft和screenTop屬性返回窗口相對于屏幕的X和Y坐標}
offsetTop: 當前元素頂部距離最近父元素頂部的距離,和有沒有滾動條沒有關系。單位px，只讀元素。
3、屏幕
屏幕分辨率的高： window.screen.height;
屏幕分辨率的寬： window.screen.width;
獲取用戶電腦屏幕的高度，是不關瀏覽器或者頂部工具欄跟底部工具欄的高度的
屏幕可用工作區(qū)高度： window.screen.availHeight;
屏幕可用工作區(qū)寬度：window.screen.availWidth;
電腦屏幕減掉頂部工具欄跟底部工具欄的高度
