Javascript 如何识别跨度并添加到其中'；s类列表

我有创建跨距的代码，我的目标是根据跨距包含的文本更改其中一些跨距的颜色。我在这里插入了一条注释，我对应该在其中编写的代码的语法有疑问。我希望根据span的文本查找span，并将其添加到其

类列表

.tagger1010 span
{
填充：6px 10px；
背景：#D0E8E4；
边界半径：18px；
颜色：#000000；
字体系列：Roboto；
字体大小：12px；
利润率：0 4px 8px 0；
字号：500；
显示：内联块；
单词包装：打断单词；
空白：正常；
光标：指针；
用户选择：无；
边框：1px实心BBD0CD；
}
.tagger1010 span.is-active{
背景色：#008fde；
颜色：#ffffff；
}
.tagger1010跨距：悬停{
背景色：#008fde；
颜色：#ffffff；
}
谷歌
微软
脸谱网
LinkedIn
常量changeColor=（evt）=>{
if（evt.currentTarget.classList.contains（“处于活动状态”））{
evt.currentTarget.classList.remove（“处于活动状态”）；
}否则{
evt.currentTarget.classList.add（“处于活动状态”）；
}
};
const EL_tagger1010_children=document.queryselectoral（“.tagger1010 span”）；
EL_tagger1010_children.forEach（EL=>EL.addEventListener（“单击”，更改颜色））；
var标签=[“微软”、“Facebook”]；
var span=div.getElementsByTagName（“span”）；
对于（i=0；i您可能不想简单地检查跨度是否包含标记，因为您想知道哪个跨度与之匹配。您可以使用嵌套for循环：

for (i = 0; i < tags.length; i++) {
    for (j = 0; j < spans.length; j++) {
        if (spans[j].textContent === tags[i]) {
            spans[j].classList.add('is-active');
        }
    }
}

假设
div.getElementsByTagName（“span”）；
将是
document.getElementsByTagName（“span”）；
，然后您可以尝试使用
filter（）
，如下所示：

var s = [...spans].filter(j => j.textContent == tags[i])[0];
if(s){
  s.classList.add('is-active')
}

演示：
.tagger1010 span{
填充：6px 10px；
背景：#D0E8E4；
边界半径：18px；
颜色：#000000；
字体系列：Roboto；
字体大小：12px；
利润率：0 4px 8px 0；
字号：500；
显示：内联块；
单词包装：打断单词；
空白：正常；
光标：指针；
用户选择：无；
边框：1px实心BBD0CD；
}
.tagger1010 span.is-active{
背景色：#008fde；
颜色：#ffffff；
}
.tagger1010跨距：悬停{
背景色：#008fde；
颜色：#ffffff；
}

谷歌
微软
脸谱网
LinkedIn
常量changeColor=（evt）=>{
if（evt.currentTarget.classList.contains（“处于活动状态”））{
evt.currentTarget.classList.remove（“处于活动状态”）；
}否则{
evt.currentTarget.classList.add（“处于活动状态”）；
}
};
const EL_tagger1010_children=document.queryselectoral（“.tagger1010 span”）；
EL_tagger1010_children.forEach（EL=>EL.addEventListener（“单击”，更改颜色））；
var标签=[“微软”、“Facebook”]；
var span=document.getElementsByTagName（“span”）；
对于（i=0；i j.textContent==tags[i]）[0]；
若有(s){
//找到文本为tags[i]的span，并将其添加到其类列表中
s、 classList.add（'is-active'）
}
}
您的代码生成的错误div未在
div.getElementsByTagName（“span”）；
…@Mamun中定义，即使在这里也是如此？它应该是“文档”而不是“div”
var s = [...spans].filter(j => j.textContent == tags[i])[0];
if(s){
  s.classList.add('is-active')
}