1

在http://jsfiddle.net/Xs9e2/上有两个元素，名为 ONE 和 TWO。通过使用 JavaScript 分配给 DOM 元素的样式属性来定位元素 ONE。元素 TWO 使用 CSS 定位。

HTML 按预期呈现。

可以按下一个按钮来提醒这两个元素中的每一个的left和属性。top我们只看到在 JavaScript 中设置的属性，而不是在 CSS 中设置的属性。

这究竟是什么原因？ 我们不应该能够通过 JavaScript 读取 CSS 属性吗？我可能错误地指定了某些内容。我知道“偏移”属性，也知道 JQuery；我只是不明白为什么这种老式的 DOM 操作不能像我预期的那样工作。我错过了什么？

4

2 回答 2

4

该style属性是，嗯，一个属性。也就是说，您只能访问 HTML 元素的属性中给出的值style：

3.2.3.8 样式属性

styleIDL 属性必须返回一个CSSStyleDeclaration其值表示该属性中指定的声明的值。（如果该属性不存在，则该对象表示一个空声明。）改变CSSStyleDeclaration对象必须在元素上创建一个样式属性（如果还没有），然后将其值更改为表示序列化形式的值CSSStyleDeclaration目的。每次都必须返回相同的对象。

使用 CSS 给出的样式不设置元素的属性，因此您无法使用.style.

但是，您可以使用getComputedStyle。

于 2012-11-30T06:11:08.197 回答
1

您可以使用 IE 特定的currentStyle，它具有所有样式或更好的标准样式（如所指出的）在 IE9+ 中支持的getComputedStylestyle ，而不是仅反映内联样式。

alert("one at " 
    + JSON.stringify([getComputedStyle(one).left,getComputedStyle(one).top])
    + "two at "
    + JSON.stringify([getComputedStyle(two).left,getComputedStyle(two).top]));
于 2012-11-30T06:10:56.760 回答