在特定标签中查找单词

Question

  let find_word="xyz"
       let el=document.getElementById("text");
        let arr = el.innerHTML.split(" ");
let newarr=[];
        for (let i = 0; i < arr.length; i++) {
          if (arr[i] === find_word) {
            newarr[i] = `<span class="highlight">${arr[i]}</span>`;
          } else {
            newarr[i] = arr[i];
          }
        }
el.innerHTML=newarr.join(" ")

我突出显示了句子中的两个 xyz，但无法突出显示其他我需要突出显示 li 标签中的 xyz，但不突出显示子标签中的 xyz

<div id="text"> Nature, in xyz broadest xyz 
<ul>
<li>xyz</li>
<li>xyz</li>
</ul> 
<sub>xyz</sub> <sub>xyz</sub> sense of world.</div>

请给我一个更好的例子。我不擅长正则表达式。我只知道基本的正则表达式。如果正则表达式可以解决这个问题。请给我推荐一些。

Answer 1

根据您对问题的修改，试试这个：

el.innerHTML.split(/\b/);

问题是“xyz”在您遗漏的地方没有被空格包围。

\b 表示单词边界，因此它将捕获您丢失的事件。

请注意，根据您的操作，它可能并不完全安全，例如如果 li 元素可以有 class="xyz" 事情可能会搞砸。

希望对您有所帮助...

在特定标签中查找单词

Find a word inside specific tags

javascript

reactjs

regex

dom