首页 > dom对象的坐标 怎样转化屏幕坐标

dom对象的坐标 怎样转化屏幕坐标

dom对象的坐标 怎样转化屏幕坐标


《javascript高级程序设计》中提供了两个方法:

        function getElementTop(element) {
            var actualTop = element.offsetTop,
                current = element.offsetParent;
            while (current !== null) {
                actualTop += current.offsetTop;
                current = current.offsetParent;
            }
            return actualTop;
        }

        function getElementLeft(element) {
            var actualLeft = element.offsetLeft,
                current = element.offsetParent;
            while (current !== null) {
                actualLeft += current.offsetLeft;
                current = current.offsetParent;
            }
            return actualLeft;
        }

用到dom对象的3个属性

offsetLeft:元素左外边框到包含元素的左内边框的像素数
offsetTop:元素上外边框到包含元素的上内边框的像素数
offsetParent:包含元素

所以把这个元素的offsetLeft/offsetTop和其包含元素的offsetLeft/offsetTop相加,如此循环直到根元素,就可以得到一个基本准确的值。

在chrome下测试没问题。这样取到的actualTop和actualLeft是元素相对浏览器窗口的top和left,一般够用了。
如果要转化成坐标,取个原点,计算一下吧。

【热门文章】
【热门文章】