[转载]获取一个HTML控件的位置

作者在 2008-02-06 19:40:14 发布以下内容
天气: 冷
心情: 平静

 

JavaScript中提供获取HTML元素位置的属性:

HTMLElement.offsetLeft
HTMLElement.offsetTop
但 是需要注意的是,这两个属性所储存的数值并不是该元素相对整个浏览器画布的绝对位置,而是相对于其父元素位置的相对位置,也就是说这两个数值得到的是以其 父元素左上角为(0,0)点从而计算出的数值。那么如何得到一个HTML元素的绝对位置呢,前一阵找到的一个比较好的函数,分享一下:
//获取元素的纵坐标
function getTop(e){
    var ffset=e.offsetTop;
    if(e.offsetParent!=null) offset+=getTop(e.offsetParent);
    return offset;
}
//获取元素的横坐标
function getLeft(e){
    var ffset=e.offsetLeft;
    if(e.offsetParent!=null) offset+=getLeft(e.offsetParent);
    return offset;
}
其 原理就是利用HTMLElement.offsetParent属性,如果当前元素的父元素不是空(null),则在原本的offsetTop基础上加上 当前的offsetTop,然后继续获取父元素的父元素的offsetTop,再将其加之,最终递归出该元素相对于整个浏览器画布的纵坐标。横坐标亦然。

转自:http://www.csser.com/html/csser/webstandards/200704/13/1776.html

关于HTML | 阅读 3980 次
文章评论,共0条
游客请输入验证码
浏览180344次