window.getComputedStyle总是以像素为单位返回测量值。

Question

8

我只是想知道为什么，例如，window.getComputedStyle(element).top总是以像素为单位返回测量值，即使在top位置明确设置为%的情况下，如element.style.top = 25 + '%'。

我没有找到任何在线信息。 有人知道这是为什么吗？！

- oldboy

1

因为相对输入值必须根据显示器显示的像素进行计算。如果您想使用“％”，则需要根据父容器的尺寸进行计算。 - charlietfl

@charlietfl 那很有道理。谢谢！ - oldboy

类似于各种颜色格式...它们会被转换，即使您输入十六进制或其他格式的值，也会返回rgb。 - charlietfl

@charlietfl 是的，我很久以前就注意到了那个问题。那个问题总是让我头疼。 - oldboy

它并不总是返回像素。例如，如果定义为百分比，则window.getComputedStyle(element).gap返回一个百分比值。（至少在火狐浏览器中是这样的） - djvg

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Bojidar Stanchev · Accepted Answer

您要查找的是 element.style.top。

这就是 window.getComputedStyle 的预期行为。

"window.getComputedStyle() 方法返回一个对象，其中包含元素所有 CSS 属性的值，在应用活动样式表并解析任何这些值可能包含的基本计算后."

也就是说，除了像素之外的单位都将被计算或处理，然后以像素形式呈现。即使是 GetComputedStyle 的名称也暗示了这一点。

如果您想了解更多信息，可以在此处阅读文档。