javascript - 为什么这个正则表达式需要这么长时间才能执行？

Question

我创建了 regex这应该将文本移动到相邻的 <span> 中标签。

const fix = (string) => string.replace(/([\S]+)*<span([^<]+)*>(.*?)<\/span>([\S]+)*/g, "<span$2>$1$3$4</span>")

fix('<p>Given <span class="label">Butter</span>&#39;s game, the tree counts as more than one input.</p>')
// Results in:
'<p>Given <span class="label">Butter&#39;s</span> game, the tree counts as more than one input.</p>'

但是如果我给它传递一个没有文本触及 <span> 的字符串标签，运行需要几秒钟。

我正在 Chrome 上测试这个和 Electron .

Answer 1

([\S]+)*和 ([^<]+)*是导致catastrophic backtracking的罪魁祸首当没有 </span> 时.您需要将正则表达式修改为

([\S]*)<span([^<]*)>(.*?)<\/span>([\S]*)

它会工作，但仍然不行 efficient .

为什么要为 \S 使用字符类？上面简化为

(\S*)<span([^<]*)>(.*?)<\/span>(\S*)

如果您只关心 span 的内容，改用这个

<span([^<]*)>(.*?)<\/span>

检查 here <=(看到步数的减少)

注意:最后不要用正则表达式解析 HTML，如果有工具可以更容易地做到这一点