带 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

与其尝试匹配所有 not 通过的情况，我只想使用以下单一模式作为您期望的格式，不包含空格：

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 匹配数字。

Demo

要限制 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.

的字符集中手动使用它们

Demo

带 rgb() 的正则表达式

RegEx with rgb()

javascript

regex

rgb