Question

我想组成一个句子。但是，根据JSON中包含的单词词典，这句话中包含包含特定CSS的关键字。

我不知道如何考虑字典单词的CSS和句子的其余部分以正确显示它。

例如，我得到一个句子：

我的网线有问题。...

问题在我的字典中的JSON文件中，我希望它获取特定的CSS。问题应该显示为红色。

我只能显示关键字。我看不出如何重建我的句子。

        for (let i = 0; i < features.length; i++) {
            for (let j = 0; j < newDataLime.length; j++) {
                if (features[i] === newDataLime[j].label) {
                    console.log(newDataLime[j].rgba);
                    spanCounter ++ 
                    // Max 12 span by each line for ver
                    if(spanCounter == 12){
                        spanCounter = 0;
                    }
                       fieldText.innerHTML = fieldText.innerHTML +  `<span class="verbatim-dashboard__text__lime hide" style="background-color: ${newDataLime[j].rgba};">${features[i]}</span>`;
                    }
                }
            }

功能是一张表格，其中包含我句子中所有空格处切开的所有单词。因此，对于我们的示例，它包含[“ I”，“ Have”，“ Problem” ...等）

变量newDataLime包含字典的关键字。

如何正确地构成我的句子？

我希望我已经足够清楚了。先感谢您！

Answer 1

您应该尝试用风格化的单词在句子数组中替换该单词。

然后，当您对数组进行完全计算后，就可以将其放在任何DOM元素中：

for (let i = 0; i < features.length; i++) {
  for (let j = 0; j < newDataLime.length; j++) {
    if (features[i] === newDataLime[j].label) {
      console.log(newDataLime[j].rgba);
      spanCounter++
      // Max 12 span by each line for ver
      if (spanCounter == 12) {
        spanCounter = 0;
      }
      features[i] = `<span class="verbatim-dashboard__text__lime hide" style="background-color: ${newDataLime[j].rgba};">${features[i]}</span>`;
    }
  }
}

fieldText.innerHTML = features.join(" ");

使用JavaScript创建包含特定CSS的关键字的句子

1 个答案: