javascript - 不使用正则表达式匹配嵌套出现的情况

Question

我正在使用 JavaScript 开发 HTML 编辑器，试图实现撤消功能。

所以我有这个 HTML 代码(带有用于存储应用程序状态的隐藏注释):

<!-- RECONSTRUCT: 'test1' -->
<h1>FOO</h1>
<!-- END RECONSTRUCT -->
<h1>BAR</h1>
<!-- RECONSTRUCT: 'test2' -->
<h1>FOOFOO</h1>
<!-- END RECONSTRUCT -->

我需要将其转换为以下 HTML 代码:

test1
<h1>BAR</h1>
test2

所以基本上，html 注释“保存”了我需要将代码恢复到的旧状态。

所以我想要正则表达式实现的是:

[0:"test1", 1:"<h1>FOO</h1>", 2:"test2", 3:"<h1>FOOFOO</h1>"]

或类似的东西。

问题是，当我尝试像这样使用正则表达式时:

src.match(/<!-- RECONSTRUCT: '(.*)' -->(.*)<!-- RECONSTRUCT END -->/g)

我明白

[0: "<!-- RECONSTRUCT: 'test1' --> ... FOO ... BAR <!-- RECONSTRUCT ... FOOFOO ... ->"]

因此完整的输入作为结果，因为它是有效的匹配。我也无法让它与负面展望一起工作:

<!-- RECONSTRUCT: '(.*)' -->((?!RECONSTRUCT:).)*

Answer 1

在 JavaScript 中 . 不匹配换行符，并且没有修饰符(如 s)可用于覆盖此行为。在 JavaScript 中执行此操作的方法是使用 [^] 而不是 .(当换行符也允许匹配时)。

还可以使用 使某些模式变得懒惰吗？:

var src = `<!-- RECONSTRUCT: 'test1' -->
<h1>FOO</h1>
<!-- END RECONSTRUCT -->
<h1>BAR</h1>
<!-- RECONSTRUCT: 'test2' -->
<h1>FOOFOO</h1>
<!-- END RECONSTRUCT -->`;

src = src.replace(
    /<!--\s*RECONSTRUCT:\s*'(.*?)'\s*-->[^]*?<!--\s*END RECONSTRUCT\s*-->/g, '$1');

console.log(src);