更改特定单词或字母组合的颜色

Question

我需要更改一个类元素中某些字母组合的颜色。例如:<span class="title">ACPRO2000</span>-在这个例子中，我想要"ACPRO"是橙色的，其余的保持默认颜色。

我需要说明的是，我并不擅长javascript。

Answer 1

javascript的函数式方法

const highlightText = (text, elem, color) => {
const element = document.querySelector( elem );
element.innerHTML = element.innerHTML.replaceAll( text, `<span style="color: ${color}">${text}</span>`);
}

highlightText("ABC", '#lettersList', 'orange')
highlightText("0", '#lettersList', 'red')
highlightText("World", '#myDiv2', 'green')

<div id="lettersList">ABC2012</div>
<div id="myDiv2">Hello World</div>