，如何获得一个元素

问题描述：

之类的标题说，如何让元素的X，相对于y位置，以他们在网页中的位置和它们的定位方案，例如绝对值，相对值等，如何获得一个元素

答

的位置

使用jQuery：

var $elt = $('select an element however'), 
    cssPosition = $elt.css('position'), 
    offset = $elt.offset(), 
    top = offset.top, 
    left = offset.left;

没有jQuery的，使用Quirksmode's findPos function：

var elt = document.getElementBy..., 
    pos = findPos(elt), 
    top = pos[1], 
    left = pos[0];

获取计算CSS position值无库another can of worms。它归结为：

element.currentStyle（IE）
getComputedStyle(element)（真正的浏览器）

我很欣赏评论，但是......我的答案是怎么回事_not_ JavaScript？ jQuery是JavaScript，我也展示了如何在没有jQuery的情况下做到这一点。 – 2011-05-26 23:06:50

jQuery的定位并不总是正确的，PPK的版本很简单 - 在某些情况下它会失败。浏览器有各种各样的定位怪癖，IE的严格，compat和quirks模式增加了混合。保持简单，生活更容易。 – RobG 2011-05-27 00:50:40

@RobG所以你有什么建议呢？我从来没有真正遇到过jQuery算法的问题。 – 2011-05-31 16:57:40

答

在现代浏览器，getBoundingClientRect和getClientRects会给你RECT对象描述你的元素。见https://developer.mozilla.org/en/DOM/element.getBoundingClientRect和https://developer.mozilla.org/en/DOM/element.getClientRects

如果你有IE8的工作，那么你就必须做在不同的浏览器不同的事情得到正确的答案（如对象检测getBoundingClientRect和依傍一些其他的方法，如果它不存在）。

jQuery offset()计算和Quirksmode findPos将在任何执行子像素定位的浏览器（例如Firefox或IE9）中给出不正确的答案，因为它们会将答案四舍五入为整数个像素。根据你在做什么，这可能会也可能不会。

答

看看这个

JS：

function findPos(obj) { 
    var curleft = curtop = 0; 
    if (obj.offsetParent) { 
     curleft = obj.offsetLeft 
     curtop = obj.offsetTop 
     while (obj = obj.offsetParent) { 
      curleft += obj.offsetLeft 
      curtop += obj.offsetTop 
     } 
    } 
    return [curleft,curtop]; 
}

HTML：

<div id="ser">&nbsp;TEST</div>

回电：

alert(findPos(document.getElementById('ser')));

我希望它对您有所帮助

仅供参考：该片段包含错误。变数“curtop”正在污染全球范围。我刚刚在quirksmode.org上写了一封关于它的文章。 http://www.quirksmode.org/js/findpos.html – 2014-08-12 04:21:46

，如何获得一个元素

相关推荐