很多时候，我们需要获取元素在页面的位置!
我们需要明白的是：
元素在页面的位置=该元素相对浏览器视窗的位置+浏览器滚动条的值
我们可以先用getBoundingClientRect()方法来获得某个元素相对浏览器视窗的位置 ｛这个方法返回的是一个对象，即Object，该对象具有4个属性：top，left，right，bottom ｝
然后再计算浏览器滚动条的值，2个值相加即可得到元素在页面的位置！
假如我们现在要获得元素obj在页面的左上角坐标位置，计算公式如下：
//chrome不能识别document.documentElement用document.body兼容
var sTop=document.documentElement.scrollTop == 0 ? document.body.scrollTop : document.documentElement.scrollTop;
var sLeft= document.documentElement.scrollLeft == 0 ? document.body.scrollLeft : document.documentElement.scrollLeft;
该obj元素在页面的Left值=obj.getBoundingClientRect().left + sLeft
该obj元素在页面的Top值=obj.getBoundingClientRect().top + sTop
注：getBoundingClientRect()方法方法之前只有ie支持，现在FF3.0+和Opera9.5+都已经支持该方法，可以说在获得页面元素位置上效率能有很大的提高！
0条评论( 网友:0 条,站长:0 条 ) 网友评论{有您的评论更精彩....}