JQuery exploite le style CSS de element_jquery

Nous utilisons souvent Javascript pour modifier le style des éléments de la page. Une façon est de changer la méta de la page

Classe CSS Element (Class), en Javascript traditionnel, nous traitons généralement le HTML

La fonctionnalité de nom de classe de Dom est implémentée ; jQuery fournit trois méthodes pour implémenter cette fonction,

Bien qu'elles aient les mêmes idées que les méthodes traditionnelles, elles économisent beaucoup de code. Toujours la même phrase –

« jQuery rend le code JavaScript concis ! »

1. addClass() – Ajouter une classe CSS

Copier le code Le code est le suivant :

$("#target").addClass("newClass");
//#target fait référence à l'ID de l'élément qui doit être stylisé
//newClass fait référence au nom de la classe CSS

2. removeClass() – Supprimer la classe CSS

Copier le code Le code est le suivant :

$("#target").removeClass("oldClass");
//#target fait référence à l'ID de l'élément dont la classe CSS doit être supprimée
//oldClass fait référence au nom de la classe CSS

3. toggleClass() – Ajouter ou supprimer une classe CSS : Si la classe CSS existe déjà, elle sera supprimée

En revanche, si la classe CSS n'existe pas, elle sera ajoutée.

Copier le code Le code est le suivant :

$("#target").toggleClass("newClass")
//Si l'élément avec l'ID "target" a un style CSS défini, il sera supprimé
; //Au contraire, la classe CSS "newClass" sera attribuée à l'ID.

Dans l'application réelle, nous définissons souvent ces classes CSS en premier, puis les déclenchons via des événements Javascript

Publier (par exemple en cliquant sur un lien) pour modifier le style des éléments de la page. De plus, jQuery fournit également une méthode

La méthode

hasClass("className") est utilisée pour déterminer si un élément s'est vu attribuer une classe CSS.

Vous trouverez ci-dessous un exemple complet.

Copier le code Le code est le suivant :

Image clignotante

Hahaha

<script> Fonction btnClick(){ <br> //$("#soccer").removeClass("up"); <br> $("#soccer").toggleClass("haut"); <br> //$("p:first").removeClass("intro"); <br> }  <br> </script>




Ce qui précède représente l'intégralité du contenu de cet article sur les styles CSS exploitant jQuery. J'espère que vous l'aimerez.