Najnowsze tutoriale tworzenie stron internetowych
 

jQuery - Pobierania i ustawiania klas CSS


JQuery, jest łatwy do manipulowania Css elementów.



Manipulowanie jQuery CSS

jQuery ma kilka metod manipulacji CSS. Przyjrzymy się z następujących metod:

  • addClass() - Dodaje jedną lub więcej klas do wybranych elementów
  • removeClass() - usuwa jeden lub więcej klas z wybranych elementów
  • toggleClass() - Przełącza pomiędzy dodawania / usuwania zajęcia z wybranych elementów
  • css() - ustawia lub zwraca atrybut stylu

Przykład arkusza stylów

Poniższy arkusz stylów będzie używany do wszystkich przykładów na tej stronie:

.important {
    font-weight: bold;
    font-size: xx-large;
}

.blue {
    color: blue;
}

jQuery addClass() Metoda

Poniższy przykład pokazuje, jak dodać atrybuty klasy z różnych elementów. Oczywiście można wybrać wiele elementów, podczas dodawania klas:

Przykład

$("button").click(function(){
    $("h1, h2, p").addClass("blue");
    $("div").addClass("important");
});
Spróbuj sam "

Można również określić wiele klas w addClass() metody:

Przykład

$("button").click(function(){
    $("#div1").addClass("important blue");
});
Spróbuj sam "

jQuery removeClass() Metoda

Poniższy przykład pokazuje, jak usunąć określony atrybut class z różnych elementów:

Przykład

$("button").click(function(){
    $("h1, h2, p").removeClass("blue");
});
Spróbuj sam "

jQuery toggleClass() Metoda

Poniższy przykład pokazuje, jak używać jQuery toggleClass() metody. Metoda ta umożliwia przełączanie pomiędzy dodawania / usuwania zajęcia z wybranych elementów:

Przykład

$("button").click(function(){
    $("h1, h2, p").toggleClass("blue");
});
Spróbuj sam "

jQuery css() Metoda

JQuery css() metoda zostanie wyjaśnione w następnym rozdziale.


Sprawdź się z ćwiczeń!

Ćwiczenie 1 » Ćwiczenie 2» Ćwiczenie 3 » Ćwiczenia 4»


jQuery CSS

Aby uzyskać pełny przegląd wszystkich metod jQuery CSS, przejdź do naszej jQuery HTML / CSS .