Javascript 将文字CSS值转换为数字

当我在元素上调用

window.getComputedStyle（）

并尝试获取诸如lineHeight之类的属性时，是否有一种方法或不同的函数每次都返回一个数值

---

我的

行高

示例引用了

normal

关键字。其他示例包括字体权重和边框宽度。所有这些都使用关键字，但映射到数值。

如果您指的是返回值可以包含

px

或其他单位，则可以使用

parseInt

函数：

function getTheStyle(elem,property)
{
    var theCSSprop = window.getComputedStyle(elem,null).getPropertyValue(property);
    return parseInt(theCSSprop);
}

var element = document.getElementById('test');
alert(getTheStyle(element,"height"));

这是一个例子。它不返回

100px

而是返回

100

可以按如下方式提取单位：

var str = "100em";
var matches = str.match(/([a-z]+)$/gi);
alert(matches);

编辑：

显然，

normal

可以由用户代理设置为“合理”值，并且是特定于字体的，规范建议它介于1.0和1.2之间。因此，您可能会计算它的

height

属性

正常

告诉用户代理将使用的值设置为基于“合理”的值 在元素的字体上。该值的含义与 . 我们建议“正常”的使用值介于1.0到1.2之间。 计算值为“”

---

这里有一个关于它的深入讨论。

不。因为并不总是有映射

例如：

<div></div>

---

现在。。。什么数值可以满足这个要求？

您可以编写一个函数，可以在线调用该函数来检查数值，如果没有，则使用开关根据文本决定返回什么。至少我会这么做。你是指文字和数字，比如：

15px

？如果你想要宽度或高度，你可以分别使用

elem.offsetWidth

和

elem.offsetHeight

。其中

elem

是包含变量的元素。不，我指的是关键字而不是单位。线条高度示例引用了“normal”关键字。其他示例包括字体权重和边框宽度。所有这些都使用关键字，但映射到数值。根据您的代码，

100px==100em==100cm

。。。不知何故，我怀疑这是正确的，或者OP的目的是什么@Nietthedark绝对正确。我假设他会知道单位是什么。如果OP甚至不知道他们是否会得到一个数字或字符串（即关键字），那么你的假设就相当鲁莽：pinded，线条高度示例指的是“normal”关键字。其他示例包括字体权重和边框宽度。所有这些都使用关键字，但映射到数值。

alert(getComputedStyle(document.body.children[0]).width);
// alerts "auto"