用Javascript獲取DOM節點相對於頁面的絕對坐標時,需要計算當前頁面的滾動距離,而這個值的獲取又取決於瀏覽器。
在Firefox或Chrome瀏覽器的控制台可以查看document.body 對應於頁面中 <body></body>部分的元素,而document.documentElement則相當於整個HTML,說明瀏覽器在解釋渲染后的頁面位置范圍是存在不同的,FF、Opera和IE瀏覽器認為在客戶端瀏覽器展示的頁面的內容對應於整個HTML,所以使用document.documentElement來代表,相應的滾動距離則通過document.documentElement.scrollLeft 和 document.documentElement.scrollTop來獲取,而Safari和Chrome瀏覽器則認為頁面開始於body部分,從而相應的滾動距離用document.body.scrollLeft 和 document.body.scrollTop來獲取。另外需要注意的是,FF和IE的quirks mode(兼容模式)下是用document.body來獲取的。
針對跨瀏覽器的解決方案則可簡單的用如下代碼獲取:
var scrollLeft = Math.max(document.documentElement.scrollLeft, document.body.scrollLeft); var scrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);