Comment modifier les styles de pseudo-classe avec JavaScript

Nous avons tous entendu parler des pseudo-classes CSS mais pas que JavaScript ait aussi des pseudo-classes. Dans les projets, nous avons souvent besoin d'utiliser JavaScript pour contrôler dynamiquement les styles des pseudo-éléments (:before,:after), mais nous. tout le monde sait qu'il n'y a pas de sélecteurs de pseudo-classes en JavaScript ou jQuery. Voici un résumé de plusieurs méthodes courantes.

HTML

<p class="red">Hi, this is a plain-old, sad-looking paragraph 
tag.</p>
CSS
.red::before {
content: &#39;red&#39;;
color: red;
}

Méthode 1

Utilisez JavaScript ou jQuery pour changer le nom de classe de l'élément

modifier le style.

.green::before {
content: 'green';
color: green;
}
$('p').removeClass('red').addClass('green');

Méthode 2

Insérez dynamiquement un nouveau style dans le