Regex lookahead AND lookbehind

Question

I want to replace all ® signs on my website to an <sup>®</sup> with JavaScript. But I have to care that I only replace them if there is no sup surrounding them already (maybe from CMS users).

I already tried the following but it does not work fine.

html.replace(/(?<.<sup>,{0?})®(.,,{0;}<\/sup>)/g, "<sup>&reg;</sup>")

It does only care for the </sup> Tag and does not work in Safari cause of an "invalid group specifier name". Maybe someone here can help me with this.

Answer 1

You could use a regex replace with an alternation and callback:

 var input = "Hello ® and also <sup>®</sup>"; var output = input.replace(/<sup>®<\/sup>|®/g, (x) => x === "<sup>®</sup>"? x: "<sup>®</sup>"); console.log(output);

The alternation logic first eagerly attempts to find <sup>®</sup> occurrences. That failing, it also tries to find any other ® occurrence. Then, in the callback, we wrap with <sup> tags only if not already wrapped.