Question

这是css中的字体声明：

font: bold italic small-caps 1em/1.5em verdana,sans-serif;

这是一个正在尝试获取px中的值的正则表达式：

value.match(/(normal|italic)?\s*(normal|small-caps)?\s*(normal|bold|bolder|lighter|100|200|300|400|500|600|700|800|900)?\s*(\d+)px(?:\/(normal|[\d\.]+))?\s+(.*)/);

帮我解决这个问题：

  var fontStyle = match[1],
       // font variant is not used
       // fontVariant = match[2],
       fontWeight = match[3],
       fontSize = match[4],
       lineHeight = match[5],
       fontFamily = match[6];

我想解析字体大小或lineheight的任何值，而不只是px，但是

[px|cm|mm|em|pt|pc|in]

但是我无法修改它。有人可以帮忙吗？

最终结果：

(normal|italic)?\s*(normal|small-caps)?\s*(normal|bold|bolder|lighter|100|200|30‌0|400|500|600|700|800|900)?\s*(\d+(?:px|cm|mm|em|pt|pc|in)*)(?:\/(normal|[\d\.]+)‌)?\s+(.*)

Answer 1

不要使用regexps解析CSS。相反，让引擎去做 - 它已经知道如何，完美!!

var elt = document.createElement('div');
elt.style.font = '1em sans-serif';
// individual properties can now be accessed as elt.style.fontFamily etc.

['fontFamily', 'fontSize'].forEach(function(x) { 
    document.writeln(x, " is ", elt.style[x], ". "); });

但是，要使其正常工作，font规范的格式必须正确（按正确的顺序）。请参阅https://developer.mozilla.org/en-US/docs/Web/CSS/font。

Answer 2

只需更改正则表达式中的px：

(\d+(?:px|cm|mm|em|pt|pc|in|%))

请注意括号。

更新：现在也会捕获该值。

用于css字体声明的正则表达式

2 个答案: