在JavaScript中创建匹配的大括号高亮显示（如代码编辑器）

我正在为网页构建一个类似小部件的部件，用户将在其中键入代码，我需要在其上实现大括号荧光灯。 因此，如果用户输入

 if(a == b)

a和b周围的大括号应高亮显示，并用颜色指示范围。 当用户单击这些括号中的任何一个时，另一个括号及其本身将高亮显示，当用户键入并完成一组括号时，也会发生同样的情况

为此，我使用contenteditable div并使用window.getSelection来确定单击/聚焦的字符是否是大括号，然后将span标记环绕在其周围以赋予其颜色

我使用innerHTML在带有彩色大括号的div中设置新的HTML，但是焦点被重置为div的开头

我希望它的行为像一个通用代码编辑器

欢迎任何想法/方向或其他方法

---

问候

不要使用innerHTML，使用DOM操纵。可能重复@FelixKling请给出一个例子？这是否意味着有其他方法可以在不使用innerHTML的情况下更改大括号@innerHTML在技术上是DOM。但我认为他的意思可能是创建一个文本节点。看看这个：@techie_28