15.8.1文件座標和視口座標

元素的位置：向右表示x軸增加，向下表示y軸增加

文件座標：相對於整個文件，在使用者移動滾動條時座標不改變

視口座標：相對於視窗

獲取滾動條位置：

1）window物件的pageXOffset和pageYOffset（除ie8以及以下版本）

2）通過

2.1)在標準模式下document.documentElement的scrollLeft和scrollTop

2.2）在怪異模式下通過docoment.body的scrollLeft和scrollTop

查詢視窗尺寸

1）window的innerWidth以及innerHeight

2）通過

2.1)在標準模式下document.documentElement的clientWidth和clientHeight

2.2）在怪異模式下通過docoment.body的clientWidth和clientHeight

15.8.2查詢元素幾何尺寸

getBoundingClientRect()不需要任何引數，返回left right top bottom屬性物件（left，top即左上角x，y座標；right，bottom表示右下角x，y座標）

這個函式返回的座標包括邊框和內邊距

getClientRects():返回只讀類陣列物件

區別：   

例如：一些被斷成兩行的斜體文字成以上形狀

內聯元素上呼叫getBoundingClientRect（）時會返回兩行寬度

而呼叫getClientRects會返回每一個矩形物件

解釋：內聯元素（行內元素）與塊狀元素

內聯元素包括：<span><code><b>

塊狀元素包括：<div>，圖片，段落

並且以上兩種方法並不會實時更新，如果滾動條改變或者視窗大小改變，其值不會改變，他們只是呼叫時文件視覺的靜態快照（拷貝）

15.8.3判定元素在某點

判定是口中指定位置有什麼元素，可以使用document.elementFromPoint()

引數：傳遞x，y座標返回元素

但只返回最裡面最上面的元素（z－index）

如果指定的店在視口以外，返回null轉換為文件座標一樣返回null

15.8.4滾動

window物件的scrollTop()方法

引數：x，y座標，可以讓瀏覽器滾動到指定點出現在視口的左上角（即滾動條向上，向左）

如果指定點在太右，太下只能保證儘可能接近

還有scrollBy,scroll,scrollTo

如果想要瀏覽器滾動到使某個元素可見，可以使用scrollIntoView()方法，

這個方法預設（不穿引數）的情況下：試圖將元素接近視口上沿

傳遞（false）：將元素接近視口下沿

15.8.5關於元素尺寸，位置，溢位的更多資訊

任何html元素都有隻讀屬性offsetLeft,offsetTop,用來返回x，y軸座標，但是這些值是文件座標，但對於已定為元素的後代元素和一些其他元素，這些屬性返回的是相對於祖先元素

offsetParent屬性指定這些元素所相對的父元素

clientWidth,clientHeight與offsetHeight,offsetWidth的區別：

clientWidth,clientHeight不包含邊框大小，只包含內容和內邊距，如果在內邊距和邊框之間加了滾動條，返回值不包含滾動條，通常對於內聯元素，這兩個屬性的值為0

且在文件根元素查詢這兩個屬性時，他們的返回值和視窗的innerWidth，innerHeight 屬性值相同

clientTop，clientLeft的值通常等於左邊和上邊的邊框寬度，如果有左邊或者上面的滾動條，則包含滾動條的寬度，通常對於內聯元素，這兩個屬性的值為0

scrollWidth以及scrollHeight是元素內容區域加上內邊距加上任何溢位內容的尺寸，如果沒有溢位部分，則等於clientxxx的值

最後：scrollLeft和scrollTop是指定滾動條的位置，注意此方法是可寫屬性，通過設定它們來讓元素中的內容滾動

html元素沒有scrollTo，只有window物件有