Search and highlight in html with multiple keywords as a single string
- by Qiusheng
In JavaScript, by given a html string with tags like:
This string has different fonts.
<b>This</b>
<i>string</i>
<span style="background-color: rgb(212, 239, 181);">has</span>
<b>different</b>
<i>fonts</i>.
When user searches for a search term with multiple words like "different fonts".
How can I add highlighting to make the html string look like:
<b>This</b>
<i>string</i>
<span style="background-color: rgb(212, 239, 181);">has</span>
<span class="highlight">
<b>different</b>
<i>fonts</i>
</span>.
Please note that the search term is treated as a single string as if the words are in a quote, so I cannot search and highlight each word individually.
