jQuery - dynamiczna zmiana przypisania istniejącej klasy stylów CSS

Stronę tą wyświetlono już: 53 razy

Biblioteka jQuery umożliwia również dynamiczne dodawanie styli CSS do elementów drzewa DOM. Pierwsza metoda to addClass, która (jak z resztą sama nazwa wskazuje) dodaje podaną klasę styli CSS do elementów drzewa DOM.

Listing 1
  1. $("p").addClass("red");

Można również usunąć daną klasę styli wykorzystując metodę .removeClass w następujący sposób:

Listing 2
  1. $("p").removeClass("red");

Możliwe jest również przełączanie dodawania klasy stylów CSS poprzez wykorzystanie metody klasy toggleClass np. w następujący sposób:

Listing 3
  1. $("p").toggleClass("red");

Możliwe jest również sprawdzenie metodą hasClass, czy do danej grupy elementów drzewa DOM została przypisana dana klasa. Przykład:

Listing 4
  1. if($("p").hasClass("red")){
  2. console.log("p have class red");
  3. }

Ważne aby wiedzieć, że jeżeli co najmniej jeden element p ma przypisaną klasę red to taka metoda hasClass zwróci prawdę.

Strony powiązane
strony powiązane
  1. api.jquery.com/addclass/ - opis metody addClass na stronie dokumentacji technicznej jQuery
  2. api.jquery.com/removeclass/ - opis metody removeClass na stronie dokumentacji technicznej jQuery
  3. api.jquery.com/toggleclass/ - opis metody toggleClass na stronie dokumentacji technicznej jQuery
  4. api.jquery.com/hasClass/ - opis metody hasClass na stronie dokumentacji technicznej jQuery

Komentarze