RegEx with rgb()

Question

我刚刚编写了以下正则表达式来捕获rgb()声明中的各种空格错误。它们是捕获相同模式的更简洁方法吗？

/( |    )*r( |  )*g( |  )*b( |  )*(( | )*[0-9]+( | )*,( |  )*[0-9]+( | )*,( |  )*[0-9]+( | )*,*( | )*)( | )*;*( | )*/g

上面的正则表达式捕获了所有这些声明：

rgb(255, 240, 0);
rgb(0,0, 0)
rgb (  0,12,0)
r gb(12,24,26 ) ;

Answer 1

您的正则表达式看起来是多余的。我会使用这样的东西：

rs*gs*bs*(s*d{1,3}s*(?:,s*d{1,3}s*){2})s*;?

注意空格如何通过s*匹配，数字如何通过d匹配。

演示

要将条目限制在 0-255 之间，需要进行以下调整：

rs*gs*bs*(s*(?:1?d{1,2}|2[0-4]d|25[0-5])s*(?:,s*(?:1?d{1,2}|2[0-4]d|25[0-5])s*){2})s*;?

请注意，d表示所有十位数字的集合。如果需要这些数字的子集，我们需要在没有d的情况下手动在字符集中使用它们。

演示

Answer 2

与其尝试匹配所有未通过的情况，我只会对您想要的格式使用以下单一模式，不包含空格：

rgb([0-9]+,[0-9]+,[0-9]+)

如果您还想断言这些数字都在 0 到 255 的范围内，那么我们可以将上述内容修改为：

rgb((1?[0-9]{1,2}|2[0-4][0-9]|25[0-5]),(1?[0-9]{1,2}|2[0-4][0-9]|25[0-5]),(1?[0-9]{1,2}|2[0-4][0-9]|25[0-5]))

代码示例：

var invalid1 = "rgb(255, 240, 0)";
var invalid2 = "rgb(0,0, 0)";
var invalid3 = "rgb (  0,12,0)";
var invalid4 = "r gb(12,24,26 )";
var valid = "rgb(10,20,30)";
console.log(/^rgb([0-9]+,[0-9]+,[0-9]+)$/.test(invalid1));
console.log(/^rgb([0-9]+,[0-9]+,[0-9]+)$/.test(invalid2));
console.log(/^rgb([0-9]+,[0-9]+,[0-9]+)$/.test(invalid3));
console.log(/^rgb([0-9]+,[0-9]+,[0-9]+)$/.test(invalid4));
console.log(/^rgb([0-9]+,[0-9]+,[0-9]+)$/.test(valid));