搜索文本并替换 html 中的文本以突出显示 angular 中的搜索词

search the text and replace the text in the html to highlight the searched word in angular

当我尝试搜索文本并更新文本时遇到问题。

<span class="container">this is a container</span>

我使用 document.getElementByClassname 来获取元素,当我用 <mark>container</mark>

替换容器时
<span class="<mark>container</mark>">this is a <mark>container</mark></span>

替换甚至发生在元素 class 名称内,但我只需要在

处进行替换
<span class="container">this is a <mark>container</mark></span>

我使用正则表达式查找搜索值,但它也在标签元素中找到

我尝试更新 innerText 但这会损坏 HTML 文档

有人知道如何实现吗?

经过长时间的搜索和理解正则表达式后,我通过正则表达式找到了解决方案

(?])容器(?]<)

这是一个容器

以上正则表达式只匹配HTML标签之外的容器可以使用正则表达式在线测试器进行测试http://regexstorm.net/