JavaScript 正则表达式没有捕捉到它应该得到的东西答案

【问题标题】：JavaScript Regex not catching what it shouldJavaScript 正则表达式没有捕捉到它应该得到的东西
【发布时间】：2017-07-14 13:51:14
【问题描述】：

我有一个 JavaScript 正则表达式，它可以在在线正则表达式测试器中按要求工作，但使用它对正则表达式不起作用：const classNameReg= new RegExp('\.?.+{[\S\s]+?}', 'g')

我将下面的所有文本作为单个字符串传递，并使用该正则表达式拆分字符串以创建一个 css 类数组，如下所示，但我返回的是整个字符串作为数组中的一个元素我首先尝试这样let arrOfClasses = css.split(classNameReg.constructor)，然后像这样let arrOfClasses = css.split(classNameReg)，然后我尝试了这个let arrOfClasses = css.split(/\.?.+{[\S\s]+?}/g)，它给了我一个只有类名部分的数组，所以.c-value-prop-box__icon {和一堆空白元素。我是 RegEx 的超级新手，两天前才开始，我做错了什么

.c-btn--vertical-center {
  align-self: center; }

.c-btn.c-btn--sm {
  min-width: 80px;
  padding: 6px 16px;
  font-size: 12px;
  font-weight: 400; }

 a.c-btn.c-btn--sm {
    height: 24px; }

button.c-btn.c-btn--sm {
    min-height: 24px; }

.c-btn.c-btn--md {
  padding: 9px 32px;
  font-weight: 600; }

a.c-btn.c-btn--md {
    height: 32px; }

button.c-btn.c-btn--md {
    min-height: 32px; }

等等。

【问题讨论】：

您的意思是使用match 吗？ css.match(/\.?.+{[\S\s]+?}/g)?
尝试将new RegExp('\.?.+{[\S\s]+?}', 'g')更改为/\.?.+{[\S\s]+?}/g
@WiktorStribiżew：这似乎是正确的。我建议您将其作为答案提交。
@Cerbrus：我实际上对当前的方法感到困惑。如果文件由这些 CSS 类组成，也许用双+换行符分割会更容易？类似于 .split(/(?:\r?\n){2,}/)。另外，我认为使用 \.? 没有任何意义，因为它是可选的，.+ 无论如何都会匹配它。
@lilezek 工作完美，谢谢！！

标签： javascript node.js regex

【解决方案1】：

您的正则表达式应该类似于以下内容（尽管这也可能不完美）。

(\S+)\s*\{([^}]*)\}

在这个例子中，我对大括号进行了转义，因为它们通常用于表示区间量词。我包括 2 个捕获组来获取元素名称，然后是内容。通常最好不要使用点，但要更具体一些。在示例中，\S 匹配任何不是空格的内容。 [^}] 匹配任何不是右大括号的内容，但如果 CSS 可以包含嵌套大括号（我目前不知道），这还不够。

rexegg.com 是学习正则表达式的好网站。此外，regular-expressions.info 非常有用。

【讨论】：