remove - comment ajouter une classe css à un élément en javascript?




remove class javascript (5)

Supposons que l' id un élément HTML soit connu, afin que l'élément puisse être référencé en utilisant:

document.getElementById(element_id);

Existe-t-il une fonction Javascript native pouvant être utilisée pour ajouter une classe CSS à cet élément?


Ajouter une classe en utilisant la propriété classList l'élément:

element.classList.add('my-class-name');

Enlèvement:

element.classList.remove('my-class-name');

Lorsqu'un élément a déjà un nom de classe défini, son influence sur l'élément est liée à sa position dans la chaîne des noms de classe. Les classes ultérieures remplacent les précédentes, en cas de conflit.

Ajouter une classe à un élément devrait déplacer le nom de la classe à la fin de la liste, s'il existe déjà.

document.addClass= function(el, css){
    var tem, C= el.className.split(/\s+/), A=[];    
    while(C.length){
        tem= C.shift();
        if(tem && tem!= css) A[A.length]= tem;
    }
    A[A.length]= css;
    return el.className= A.join(' ');   
}

vous pouvez utiliser setAttribute .

Exemple: pour ajouter une classe:

 document.getElementById('main').setAttribute("class","classOne"); 

Pour plusieurs classes:

 document.getElementById('main').setAttribute("class", "classOne classTwo"); 


addClass=(selector,classes)=>document.querySelector(selector).classList(...classes.split(' '));

Cela ajoutera UNE classe ou plusieurs classes:

addClass('#myDiv','back-red'); // => Add "back-red" class to <div id="myDiv"/>
addClass('#myDiv','fa fa-car') //=>Add two classes to "div"




css