javascript 正则表达式匹配十六进制颜色语法（和缩短形式）
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9682709/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Regexp Matching Hex Color Syntax (and Shorten form)
提问by cl0udw4lk3r
Well, i'm pretty new on regex and in particular on js regexp
好吧，我对正则表达式很陌生，尤其是在 js 正则表达式上
I'm looking for making a regexp that match the Hex Color Syntax (like "#34ffa6") then i gave an eye on the w3school page: Javascript RegExp Object
我正在寻找匹配十六进制颜色语法（如“#34ffa6”）的正则表达式，然后我关注了 w3school 页面：Javascript RegExp Object
Then that's my regexp: /^#[0-9a-f]{6}/i
那就是我的正则表达式： /^#[0-9a-f]{6}/i
it seems to work but, if i want it to match also the "short hex color syntax" form? (like "#3fa"), it's possible? I'v tried using the caracter |but maybe i'm wrong with the syntax...
它似乎有效，但是，如果我希望它也匹配“短十六进制颜色语法”形式？（比如“#3fa”），这可能吗？我试过使用字符| 但也许我的语法错了...
Thx in advance and sorry for the surely bad english (i'm italian...)
提前感谢并为肯定不好的英语感到抱歉（我是意大利人......）
回答by rodneyrehm
/^#[0-9a-f]{3,6}$/i
would match #abc, #abcd, #abcde, #abcdef
将匹配#abc, #abcd, #abcde,#abcdef
/^#([0-9a-f]{3}|[0-9a-f]{6})$/i
would match #abcand #abcdefbut not #abcd
将匹配#abc和#abcdef，但不#abcd
/^#([0-9a-f]{3}){1,2}$/i
would match #abcand #abcdefbut not #abcd
将匹配#abc和#abcdef，但不#abcd
/^#(?:[0-9a-f]{3}){1,2}$/i
would match #abcand #abcdefbut not #abcd
将匹配#abc和#abcdef，但不#abcd
Have a look at RegExp - MDNto learn more about regular expressions in javascript.
查看RegExp - MDN以了解有关 javascript中正则表达式的更多信息。
回答by Manse
Try this :
试试这个 ：
/^#([0-9a-f]{6}|[0-9a-f]{3})$/i
[0-9a-f]{6}= 6 characters
[0-9a-f]{3}= 3 characters
$= end
[0-9a-f]{6}= 6 个字符
[0-9a-f]{3}= 3 个字符
$= 结尾
回答by Saket Patel
this should work
/#[0-9a-f]{6}|#[0-9a-f]{3}/gi
这应该有效
/#[0-9a-f]{6}|#[0-9a-f]{3}/gi
and for trying out regular expressions on the fly and learning it you can use this site http://gskinner.com/RegExr/
为了即时试用正则表达式并学习它，您可以使用此站点 http://gskinner.com/RegExr/
回答by jamess
You might want to incorporate 4 and 8 digit hex for #RGBA and #RRGGBBAA. I am doing this in a different setting where I'm using match()and split()to generate arrays. I could not get all the variations posted by @rodneyrehm to work with the g flag and match, but the first (and most verbose) solution works if I list the character count in high to low order: 8, 6, 4, 3.
您可能希望为 #RGBA 和 #RRGGBBAA 合并 4 位和 8 位十六进制。我在不同的设置中执行此操作match()并split()生成数组。我无法让@rodneyrehm 发布的所有变体与 g 标志和匹配一起使用，但是如果我按从高到低的顺序列出字符数：8、6、4、3，第一个（也是最详细的）解决方案会起作用。
let rx = /(?:#)[0-9a-f]{8}|(?:#)[0-9a-f]{6}|(?:#)[0-9a-f]{4}|(?:#)[0-9a-f]{3}/ig
let s = "123 #AA22CC 100% #12F abc #A2Cd #aa11cc44 test 236px";
let arr = s.match(rx); // arr == ["#AA22CC", "#12F", "#A2Cd", "#aa11cc44"]
The MDN docs say that (?:#)should forget "#", but it does not, and (?=#)simply fails. What am I misunderstanding?
My final goal is to include the other numeric values in the array returned from match(). I'm almost there...
MDN 文档说(?:#)应该忘记"#"，但它没有，(?=#)只是失败了。我有什么误解？
我的最终目标是在从match(). 我快到了...
