【问题标题】:How I can find specific words in the string and add class (Javascript)如何在字符串中找到特定单词并添加类(Javascript)
【发布时间】:2026-01-10 03:00:02
【问题描述】:

P 元素中有一个文本。在此文本中,您可以通过单击鼠标选择一些术语。但我想在不同的类中显示一些以前选择的单词

我想在这个文本中找到特殊的单词并添加类。

相关部分

var previosSelectedWords = 'aute,dolor,ex,sed,velit'; // previos selected words
var PSW = previosSelectedWords.split(',');

for (var i = 0; i < words.length; i++) {
    if (PSW[i] == words[i]) {
      wrapped.push('<span class="previosSelecteds">' + words[i] + '</span>');
    } else {
      wrapped.push('<span>' + words[i] + '</span>');
    }
  }

但它不显示预先选择的单词。可能是什么原因?

【问题讨论】:

  • 我每次点击一个词都会得到TypeError: document.getElementById(...) is null。好像没有id="ImWo"
  • @adiga 我创建的
  • @HappyAnt 这是一个允许发布所选单词的表单元素。
  • 如果您发布的代码运行时不会抛出由您未包含在代码中但应该存在的元素引起的错误,那就太好了。 ;)

标签: javascript jquery html split


【解决方案1】:

问题在于您的循环:您对两个数组使用了相同的循环和相同的索引。

   // Loop through each word and wrap
for (var j = 0; j < PSW.length; j++) {
    for (var i = 0; i < words.length; i++) {
        if (PSW[j] == words[i]) {
            var prevS = '<span class="previosSelecteds">' + words[i] + '</span>';
            words[i] = prevS;
        } 
    }
}

for (var i = 0; i < words.length; i++) {
    if (!words[i].includes('previosSelecteds')) {
        wrapped.push('<span>' + words[i] + '</span>');
    }
    else {
        wrapped.push(words[i]);
    }
}

【讨论】:

  • 坦率地说,我没想到会这样。感谢您的帮助!我能问你最后一个问题吗?一个选定的词;例如:people,但在文本中:`人? ` 如果有问号(或逗号等)不显示所选文本。您对解决方案有任何想法吗?还是我应该提出一个新问题?
  • 我刚刚注意到,当您选择任何预选单词时,我的解决方案仍然存在问题。试图解决这个问题。如果您还有其他问题,您应该打开一个新问题。
  • 通过检查类是否已添加到跨度来修复该问题。
  • 嗨,我有一个新问题。如果您想评论this page@HappyAnt,我将不胜感激