Cum pot adăuga o clasă la un anumit element?

Am un element care are deja o clasă:

<div class="someclass">
    <img ... id="imagine1" name="imagine1" />
</div>

Acum vreau să creez o funcție JavaScript care să adauge o clasă la div (nu să înlocuiască, ci să adauge).

Cum pot face acest lucru?

Edwin Pratt
Întrebarea editată 9 mai 2019 в 10:31
Programare
javascript dom-manipulation
3 februarie 2009 в 1:54
27 vizualizări
Soluția

Adăugați un spațiu plus numele noii clase la proprietatea className a elementului. În primul rând, puneți un id pe element, astfel încât să puteți obține cu ușurință o referință.

<div id="div1" class="someclass">

</div>

Apoi

var d = document.getElementById("div1");
d.className += " otherclass";

Observați spațiul înainte de otherclass. Este important să includeți spațiul, altfel compromiteți clasele existente care vin înainte de aceasta în lista de clase.

A se vedea, de asemenea, element.className pe MDN.

Sean Ker
Răspuns editat 4 octombrie 2019 в 9:27
Comentarii (14)

găsiți elementul țintă "d" cum doriți și apoi:

d.className += ' additionalClass'; //note the space

puteți să o înfășurați în moduri mai inteligente pentru a verifica preexistența și pentru a verifica cerințele de spațiu etc..

Cœur
Răspuns editat 26 februarie 2017 в 4:29
Comentarii (4)

Presupunând că faceți mai mult decât adăugarea acestei clase (de exemplu, aveți cereri asincrone și așa mai departe), v-aș recomanda o bibliotecă precum Prototype sau jQuery.

Acestea vor face ca aproape tot ceea ce va trebui să faceți (inclusiv acest lucru) să fie foarte simplu.

Așadar, să spunem că acum aveți jQuery pe pagină, ați putea folosi un cod ca acesta pentru a adăuga un nume de clasă la un element (la încărcare, în acest caz):

$(document).ready( function() {
  $('#div1').addClass( 'some_other_class' );
} );

Consultați jQuery API browser pentru alte lucruri.

Comentarii (0)