0

我正在尝试编写一个匹配以下 YACC 表达式的正则表达式 [left | right] || [top | bottom]：

它应该匹配：（左或右）AND OR（顶部或底部）。OR ' |' 做起来很简单，但 ' ||' 我想不通。这个表达式是 W3C 定义的 CSS 渐变语法的一部分：

<linear-gradient> = linear-gradient(
    [ [ <angle> | to <side-or-corner> ] ,]? 
    <color-stop>[, <color-stop>]+
)

<side-or-corner> = [left | right] || [top | bottom]

编辑：给予：左上匹配：左上

给予：左 匹配：左

给予：右下 匹配：右下

给予：对 20px 匹配：对

希望这能更好地解释它。谢谢

4

2 回答 2

0 
/(left|right)|(top|bottom)|(left|right)\s(top|bottom)/

应该做的任务。您可以将其缩短为

/(left|right|top|bottom)|(left|right)\s(top|bottom)/

或者

/(left|right)|((left|right)\s)?(top|bottom)/
于 2012-07-04T10:46:40.970 回答
0

如果我理解正确，您需要一侧（左/右/上/下）或角落（左上，右下......）。
这可以像这样解决： 

/^((left|right|top|bottom)|((top|bottom)delimiter(left|right)))$/

当然，您可以颠倒角符号的边顺序（将角输出为left-top而不是top-left）： 

/^((left|right|top|bottom)|((left|right)delimiter(top|bottom)))$/

请注意，分隔符是您想要的分隔符（可以是空格或减号）。
希望这可以帮助！

PS：我在推特上听到了你的求助电话：P。

根据您的编辑进行更新
，我想现在我了解您的需要： 

/^((left|right|top|bottom)|((left|right|(-?\d*(\.\d+)?(px|em|\%)))\s+(top|bottom|(-?\d*(\.\d+)?(px|em|\%)))))$/

这个正则表达式现在匹配一个边（left/top/right/bottom）或由 left 和 top 值定义的两个边，可以是方向关键字（left/top/right/bottom）或实际值（例如100pxor 1.4em） .
值正则表达式 ( -?\d*(\.\d+)?(px|em|\%)) 匹配任何浮点数（即使没有第一个零：.123而不是0.123），后跟一个测量单位（在这里您可以提供完整的单位列表）

这是我通过的一些（javascript）测试：

var pattern = /^((left|right|top|bottom)|((left|right|(-?\d*(\.\d+)?(px|em|\%)))\s+(top|bottom|(-?\d*(\.\d+)?(px|em|\%)))))$/;
pattern.test('left bottom');   // true
pattern.test('-10px top');     // true
pattern.test('-.23em 140%');   // true

最终更新

  • 删除了开始和结束字符
  • 切换了边和角模式的顺序，优先匹配角模式

/(((left|right|(-?\d*(\.\d+)?(px|em|\%)))\s+(top|bottom|(-?\d*(\.\d+)?(px|em|\%))))|(left|right|top|bottom))/

于 2012-07-04T10:49:47.110 回答