JavaScript正则表达式匹配引号中的字符，而不匹配字符集中的字符

我有一个字符串，我想使用

#、、[]或{}

字符拆分，就像在CSS中一样。所需的功能是：

-输入：

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

-输出：

[“div”、“#foo”、“[bar='value'”、.baz”、“{text”]

这很简单，使用以下正则表达式：

input.match（/（[\\[{]\[{]}.*/g）

但是，这不会忽略引号内的语法字符，我也希望如此。（e.x.

“div[bar='value.baz']”

应该忽略

）

如何使正则表达式的第二部分（

[^#.\[{\]}]*

部分）不仅捕获求反的字符集，而且捕获引号内的任何字符。换句话说，如何将正则表达式，

（\“|”）+？\1

实现到当前的正则表达式中

编辑： 我已经找到了一个正则表达式，它工作正常，但不能处理引号内的转义引号（例如：

“stuff here\\”quote“

）。如果有人知道如何做，这将非常有用：

---

str.match（/（[\.\[\[\]\\\[\\\]\..*）（['“]）.\3[^.\\[\\]{\}]）*/g）

首先，我强调的太多了：你不应该使用正则表达式来解析css，你应该使用真正的解析器，例如，或者类似的解析器——很多人已经构建了它们，你不需要重新发明轮子

也就是说，要解决您当前的问题，请执行以下操作：

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

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

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

给定字符串，它将生成

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

---

上面的RegExp松散地基于

输入字符串实际上不是文本CSS。我正在尝试编写一个regex，它可以按上面列出的字符分割输入字符串。我想在分割中包括

，但忽略它（或上面列出的任何字符）如果它们在引号内。我稍微修改了它，以处理

{}

内的引号和

[]

内的多个

bar=value

：

str.match（/（^.[\.\.[\]{}]）（[^'.\[\]{}+）（'[^']*'）？（'[^']*'）+/g）

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

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