Comment supprimer les styles d'un élément à l'aide de JQuery-Questions et réponses frontales-php.cn

JQuery est une bibliothèque JavaScript très populaire. Les développeurs utilisent souvent JQuery pour exploiter des éléments dans des pages HTML. Dans JQuery, nous pouvons utiliser des méthodes simples pour manipuler le style des éléments, comme l'ajout de styles, la suppression de styles ou la modification de styles.

Cet article se concentrera sur la façon d'utiliser JQuery pour supprimer le style d'un élément.

Utilisez la méthode RemoveClass()

JQuery fournit une méthode RemoveClss() pour supprimer un ou plusieurs styles d'un élément.

Le format de syntaxe est le suivant :

$(selector).removeClass(classname,function);

Copier après la connexion

Parmi eux, le paramètre classname est le nom de la classe CSS qui doit être supprimée. Plusieurs classes CSS peuvent être supprimées en même temps, séparées par des espaces entre les noms de classe.

La deuxième fonction de paramètre facultatif est la fonction de rappel qui doit être exécutée après la suppression de la classe CSS.

Par exemple, nous pouvons utiliser la méthode removeClass() pour supprimer une classe CSS d'un élément, comme suit :

$("p").removeClass("myClass");

Copier après la connexion

Remarque : Si vous devez supprimer tous les CSS de l'élément Class, vous pouvez utiliser la méthode RemoveClass() sans passer aucun paramètre :

$("p").removeClass();

Copier après la connexion

Utilisez la méthode RemoveAttr()

In JQuery, nous pouvons également utiliser la méthode removeAttr() pour supprimer les attributs des éléments HTML. Certains éléments HTML (tels que les images) peuvent avoir des styles en ligne, et cet attribut peut être supprimé via la méthode removeAttr().

Le format de syntaxe est le suivant :

$(selector).removeAttr(attributeName);

Copier après la connexion

Parmi eux, le paramètreattributName est le nom d'attribut de l'élément HTML qui doit être supprimé.

Ce qui suit est un exemple de suppression de l'attribut src d'un élément img :

$("img").removeAttr("src");

Copier après la connexion

Utilisation de la méthode css()

# #En plus des deux méthodes ci-dessus, nous pouvons également utiliser la méthode css() pour supprimer le style d'un élément. Cette méthode nous permet de supprimer le style d'un élément en définissant la valeur de la propriété CSS sur une chaîne vide.

Le format de syntaxe est le suivant :

$(selector).css(property,value);

Copier après la connexion

Parmi eux, la propriété du paramètre est le nom de la propriété CSS qui doit être supprimée et la valeur du paramètre doit être définie à une chaîne vide.

Voici des exemples de code pertinent :

$("p").css("font-size", "");

Copier après la connexion

tels que Comme mentionné auparavant, la méthode removeClass() pouvait supprimer une ou plusieurs classes CSS en même temps. Cependant, si vous devez supprimer plusieurs styles de plusieurs éléments en même temps, vous devez utiliser la méthode each().

$("p").each(function(){ $(this).removeClass("myClass1 myClass2"); });

Copier après la connexion

Dans l'exemple ci-dessus, nous sélectionnons d'abord tous les éléments p, puis utilisons la méthode each() pour parcourir chaque élément p.

Dans chaque boucle, nous utilisons à nouveau JQuery pour sélectionner l'élément actuel, puis utilisons la méthode removeClass() pour supprimer les deux classes CSS.

Si vous devez supprimer la classe CSS avec le préfixe spécifié, vous pouvez utiliser l'attr de JQuery () et la méthode indexOf() pour terminer.

$("[class^='myPrefix']").removeAttr("class");

Copier après la connexion

Dans l'exemple ci-dessus, nous sélectionnons d'abord tous les éléments dont les valeurs d'attribut de classe commencent par 'myPrefix', puis utilisons la méthode removeAttr() pour supprimer leurs attributs de classe.

Résumé :

Ci-dessus, vous trouverez plusieurs façons d'utiliser JQuery pour supprimer le style des éléments. L'utilisation de JQuery peut supprimer le style des éléments très rapidement et facilement, et JQuery facilite également le développement Web.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!