JavaScript正規表現は引用符で囲まれ、文字セットには含まれません

Question

CSSのように、#, ., [], or {}文字を使用して分割したい文字列があります。希望する機能がある：

- 入力： "div#foo[bar='value'].baz{text}"
- 出力： ["div", "#foo", "[bar='value'", ".baz", "{text"]

これは、この正規表現で、十分に簡単です： input.match(/([#.\[{]|^.*?)[^#.\[{\]}]*/g)

しかし、これは引用符内の構文の文字を無視していません、私もそれが好きです。

（e.x. "div[bar='value.baz']"が.を無視すべきである）どのように私は私の正規表現の第二部（[^#.\[{\]}]*部分）は否定文字セットが、また、引用符内の任意の文字だけでなく取り込むことができます。言い換えれば、どのようにRegEx、私の現在のものに(\"|').+?\1を実装することができます。

編集： 私はまともな作品正規表現を考え出しましたが、（例："stuff here \\" quote "）引用符の内側にエスケープ引用符を処理することはできません。まず

str.match(/([#.\[{]|^.*?)((['"]).*?\3|[^.#\[\]{\}])*/g);

Answer 1

に基づいて作成し

var str = "div#foo[bar='value.baz'].baz{text}"; 
str.match(/(^|[\.#[\]{}])(([^'\.#[\]{}]+)('[^']*')?)+/g) 
// [ 'div', '#foo', '[bar=\'value.baz\'', '.baz', '{text' ] 

Answer 2

、と私はこの十分に強調することはできません：誰かがそれを行う方法を知っているならば、それは非常に参考になるあなたは、CSSを解析するために正規表現を使用しないでください、あなたは本当のパーサーを使用する必要がありますたとえばhttp://glazman.org/JSCSSP/またはそれに類するもの - 多くはそれらを組み込んだものであり、ホイールを再構成する必要はありません。あなたの現在の問題を解決するために、言わ

はこれを行う：あなたの文字列が与えられ

var str = "div#foo[bar='value.foo'].baz{text}"; 

str.match(/([#.\[{]|^.*?)(?:[^#\[{\]}]*|\.*)/g); 

//["div", "#foo", "[bar='value.foo'", ".baz", "{text"] 

Answer 3

var tokens = myCssString.match(/\/\*[\s\S]*?\*\/|"(?:[^"\\]|\\[\s\S]*)"|'(?:[^'\\]|\\[\s\S])*'|[\{\}:;\(\)\[\]./#]|\s+|[^\s\{\}:;\(\)\[\]./'"#]+/g); 

を、それが上記

div 
# 
foo 
[ 
bar= 
'value.foo' 
] 
. 
baz 
{ 
text 
} 

正規表現が緩くCSS 2.1 lexical grammar