带有 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

我不会尝试匹配所有未通过的情况，而是将以下单一模式用于您期望的格式，不包含空格：

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));

Answer 2

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

r\s*g\s*b\s*\(\s*\d{1,3}\s*(?:,\s*\d{1,3}\s*){2}\)\s*;?

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

演示

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

r\s*g\s*b\s*\(\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.

演示