一 前言

在前端開發中總會遇到各種各樣需要使用或計算坐標和距離的情況，但是這些屬性和方法眾多，全部熟練地記下來并非是一件易事，大多只能現查，耗費不少時間精力，于是便有了整理記錄的想法，即加深了印象，又方便隨時查閱。

二 window 對象

瀏覽器里面，window 對象（注意，w為小寫）指當前的瀏覽器窗口。
它也是當前頁面的頂層對象，即最高一層的對象，所有其他對象都是它的下屬。一個變量如果未聲明，那么默認就是頂層對象的屬性。
摘自《阮一峰 JavaScript 教程》

位置大小屬性

window.screenX , window.screenY

只讀屬性

返回瀏覽器窗口左上角相對于當前屏幕左上角的水平距離和垂直距離（單位像素）。

window.innerHeight , window.innerWidth

只讀屬性

返回網頁在當前窗口中可見區域的高度和寬度，即「視口」（viewport）的大?。▎挝幌袼兀?/p>

注意，這兩個屬性包括滾動條的高度和寬度。

window.outerHeight , window.outerWidth

只讀屬性

返回瀏覽器窗口的高度和寬度，包括瀏覽器菜單和邊框（單位像素）。

window.scrollX , window.scrollY

只讀屬性

別名： window.pageXOffset , window.pageYOffset

分別返回頁面的水平滾動距離和垂直滾動距離，單位都是像素。

注意，這兩個屬性的返回值不是整數，而是雙精度浮點數。如果頁面沒有滾動，它們的值就是0。

摘自《阮一峰 JavaScript 教程》

為了跨瀏覽器兼容性，請使用 window.pageXOffset 代替 window.scrollX。另外，舊版本的 IE（<9）兩個屬性都不支持，必須通過其他的非標準屬性來解決此問題。

摘自 MDN ：https://developer.mozilla.org/zh-CN/docs/Web/API/Window/scrollX

window 對象的方法

window.scrollTo() , window.scroll() , window.scrollBy()

window.scrollTo 方法 ---> 別名： window.scroll 方法

用于將文檔滾動到指定位置。

它接受兩個參數，表示滾動后位于窗口左上角的頁面坐標。

也可以接受一個配置對象作為參數。

window.scrollTo(options)

配置對象 options 有三個屬性。

window.scrollBy 方法用于將網頁滾動指定距離（單位像素）。

它接受兩個參數：水平向右滾動的像素，垂直向下滾動的像素。

注意：仔細體會這兩者的差別。

三 Element 節點