Verwenden Sie Javascript (nicht jQuery!), Um Wortzählung auf mehreren Formularbeschriftungen durchzuführen

Question

Ich habe mehrere Etiketten als Teil meines Formulars und ich bin nicht in der Lage, Klassen an sie einzeln aufgrund der Einschränkungen des Systems anzuhängen, in dem ich arbeite und sie enthalten keine IDs. Ich muss die Etiketten abhängig von ihrem Inhalt, z.B. Wenn es weniger als 5 Wörter hat, dann werde ich es in eine Richtung stylen, wenn es mehr als 5 Wörter hat, werde ich es anders gestalten. Ich muss einen Weg finden, dynamisch eine Klasse zum Label hinzuzufügen, abhängig davon, ob es weniger oder mehr als 5 Wörter hat.

Answer 1

Sie können etwas tun:

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" 
    } 


} 

Here is a JsFiddle showing the example.

Answer 2

Ist das, was Sie meinten: 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'); 
}