Javascript：比较具有不确定单位的不同CSS绝对长度和大小值的最佳方法是什么？

Question

我遇到了需要比较<p>的indentation（marginLeft）值的情况。

有什么比较通用的方法吗？

a="10px"
b="10pt"
c="calc( 20pt - 10px ) "
d="1cm"
e="1in"

我想要一些运算符e>d>c>b>a ，现在我只能使用parseInt ，并且必须确保每个marginLeft都使用pt单位。

ps calc可能太难了，没有必要。

pps是否有任何库可以比较相对长度？

ppps如何计算某个单位的数值差？

Answer 1

您可以使用window.getComputedStyle()方法来执行此操作。
即使通过CSS设置了样式，这也可以返回元素的当前样式（如果通过CSS设置，则element.style.marginLeft不会返回样式）。

您可以像这样使用它：

var element = document.getElementById("myElement");
var margin = window.getComputedStyle(element).getPropertyValue('margin-left');

这将始终返回以像素为单位的值，从而使其易于比较。

请注意，尽管此方法是非标准的，并且可能不适用于某些浏览器。