先介紹幾個屬性：（暫時只測了IE和firefox，實際上我工作中用到的最多的是chrome）
網頁被捲起來的高度/寬度（即瀏覽器滾動條滾動後隱藏的頁面內容高度）
(javascript) document.documentElement.scrollTop //firefox
(javascript) document.documentElement.scrollLeft //firefox
(javascript) document.body.scrollTop //IE
(javascript) document.body.scrollLeft //IE
(jqurey) $(window).scrollTop()
(jqurey) $(window).scrollLeft()
網頁工作區域的高度和寬度
(javascript) document.documentElement.clientHeight// IE firefox
(jqurey) $(window).height()
元素距離文檔頂端和左邊的偏移值
(javascript) DOM元素對象.offsetTop //IE firefox
(javascript) DOM元素對象.offsetLeft //IE firefox
(jqurey) jq對象.offset().top
(jqurey) jq對象.offset().left
獲取頁面元素距離瀏覽器工作區頂端的距離
頁面元素距離瀏覽器工作區頂端的距離 = 元素距離文檔頂端偏移值 - 網頁被捲起來的高度
即：
頁面元素距離瀏覽器工作區頂端的距離 = DOM元素對象.offsetTop - document.documentElement.scrollTop
舉個應用例子：(個人習慣用jqurey，免去兼容性煩惱)
利用 頁面元素距離瀏覽器工作區頂端/左端的距離 來實現一個提示框在頁面不同位置時候保證提示信息顯示的正確位置，如圖所示 附代碼
可見不管輸入框在哪裏，提示框信息永遠都顯示在正確的位置，而不會在彈出提示框時候被擋住
code（上面例子的html頁面,需引用jquery-1.8.2.min.js）