获取元素位置 - { absolute|relative|fixed } 返回空值？

Question

使用 JavaScript，我们可以设置元素的相对位置，例如：

object.style.position = "absolute" || "fixed" || "relative"

但是，使用相同的 console.log(object.style.position) 时，它不会返回应用于对象的位置 - 它返回 null。我是否遗漏了什么，或者还有其他方法可以实现我试图实现的功能？

- Vivek Chandra

---

它正在运行：http://jsfiddle.net/9TpfT/ - Alexandre Khoury

@mageek - 不工作的（我实际想要的）版本 - Fiddle - Vivek Chandra

只有在未明确设置时，它才会返回 null。如果已经设置，则会返回该值。 - Uncle Iroh

是的，因为我不知道为什么，但如果这个CSS不是内联的，你就不能get对象的样式（但你可以set它）。请参见我在此处的其他答案：http://www.stackoverflow.com/questions/10919859/javascript-animation-is-not-runing/10920445 - Alexandre Khoury

@uncle，这就是问题所在——如果它在CSS中被指定了，如何检索它是我的问题.. :) - Vivek Chandra

好的，pimvdb的解决方案可能很不错。 - Alexandre Khoury

Answer 1

.style 表示元素本身设置的样式，就像 style 属性一样。

您也可以使用 getComputedStyle： http://jsfiddle.net/qAbTz/1/。

var div = document.getElementById("div");

console.log(div.style.position);              // "" (not null by the way)
console.log(getComputedStyle(div).position);​  // "fixed"

- pimvdb

---

浏览器兼容性？.. MDN链接 .. 但是，quirks已经提供了解决方法.. 所以，我们会研究一下.. 谢谢.. :) - Vivek Chandra

@Vivek Chandra：我相信jQuery也支持其他浏览器；你可以查看它的源代码以了解如何实现。如果可用，似乎使用.currentStyle。 - pimvdb

目前还没有使用jQuery。想自己解决 - 正在研究quirks提供的解决方案.. 希望它能解决我的问题。 - Vivek Chandra

@Vivek Chandra：我并不推荐使用jQuery :) 看起来那篇文章也在谈论.currentStyle。 - pimvdb

是的..他们推荐的方法很好..我会查一下..感谢你提供了getComputedStyle - 让我朝着正确的方向前进.. - Vivek Chandra

该函数太慢了，有没有其他的替代方案？ - doubleOrt

Answer 2

请注意（根据pimvdb提出的相同逻辑），如果您在对象的样式中指定了初始位置，则可以通过div.style.position访问它。

<div id="div" style="position: absolute;"></div>

http://jsfiddle.net/qAbTz/4/

- Jeremy Goodell