使用Javascript(而不是jQuery！）对多个表单标签执行单词计数

Use Javascript (not jQuery!) to perform word count on multiple form labels

本文关键字：表单 标签 执行 单词计 Javascript jQuery 使用      更新时间：2023-09-26

我有多个标签作为表单的一部分，由于我工作的系统的限制，我无法将类单独附加到它们上，而且它们不包含ID。我需要根据标签的内容对标签进行不同的风格设置，例如，如果标签少于5个单词，我会用一种方式进行风格设置，如果标签超过5个单词我会用另一种方式来进行风格设置。我需要找到一种方法来动态地将一个类添加到标签中，这取决于它的单词是少于还是多于5个。

您可以这样做：

var labels = document.getElementsByTagName("label");

for(let ii = 0; ii < labels.length; ii++){
    let currentLabel = labels[ii];
    let words = currentLabel.innerHTML.split(' ');
  if(words.length >= 5)
  {
        currentLabel.className = "bold"
  }

}

这里有一个JsFiddle展示了这个例子。

这就是你的意思吗：http://codepen.io/zvona/pen/BzVkqm

window.addEventListener('DOMContentLoaded', onLoad, false);
function onLoad() {
  [].forEach.call(document.querySelectorAll('label'), assignClasses); 
}
function assignClasses(elem) {
  var words = elem.textContent.split(' ');
  elem.classList.add((words.length <= 5) ? 'fiveOrLess' : 'moreThanFive');
}
相关文章：