javascript - 为什么这个非捕获组会捕获？

Question

应用此正则表达式模式:

/(?:(^| |\>|\+))+([a-z\-\_]+)/gi

到这个字符串:

body.test ol+li ol > li #foobar p>span a[href=*]

我得到这些匹配项，以逗号分隔:

body, ol,+li, ol, > li, p,>span, a

为什么有些匹配项有前导空格 、> 和 + 符号？我希望我的正则表达式 (?:(^| |\>|\+)) 的这一部分能够匹配这些符号，但不会捕获它们。

编辑:我正在尝试匹配 html 标签和 css 选择器，以提高 css 选择器的 css 特异性。因此，我想单独匹配每个 li 或 span 等，而不使用 + 或 >。

Answer 1

捕获与匹配不同。由于您在模式中指定了组合器，因此匹配器将拾取它们，无论它们是捕获的还是未捕获的。

要捕获，您需要在字符串上 exec() 执行正则表达式并循环遍历结果，其中将包含您的捕获组。我还清理了您的模式并对其进行了修改，以便它不会进行不必要的捕获，并且会识别 the general sibling combinator ~ :

var sel = "body.test ol+li ol > li #foobar p>span a[href=*]";
var re = /(?:^| |>|\+|~)+([a-z_-]+)/gi;
var matches = [], m;

while (m = re.exec(sel)) {
    matches.push(m[1]);
}

然后您将获得预期的匹配项:

body, ol, li, ol, li, p, span, a