Comment modifier le CSS en js natif

Les méthodes sont : 1. Via node.style.cssText="css expression 1; css expression 2; css expression 3"; 2. Définissez d'abord le style d'une classe spécifique dans la feuille de style CSS, puis transmettez le nœud. classname="class name" attache le paramètre de style de la classe au nœud node.

L'environnement d'exploitation de ce tutoriel : système Windows7, version CSS3&&HTML5, ordinateur Dell G3.

Maintenant, je vais vous présenter deux façons de changer le style CSS en js natif :

1Bynode.style.cssText="css expression 1; css expression 2; dans le code javascript; css expression 3"change directement le style CSS.

2Définissez d'abord le style d'une classe spécifique telle que "classe active" dans la feuille de style CSS (la classe active ici est supposée et n'existe pas pour le moment), puis transmetteznode.classname=" active" dans le code javascript "provoque l'attachement du paramètre de style de la classe active dans la feuille de style CSS au nœud du nœud.

Ce qui suit est une introduction détaillée, le premier est le code html :

Utilisez d'abord la première méthode mentionnée ci-dessus pour changer le style CSS, écrivez le code javascript suivant :

Le résultat en cours d'exécution est :

Utilisez ensuite la deuxième méthode mentionnée ci-dessus pour changer le style CSS et écrivez le code javascript suivant :

Le même résultat d'exécution est :

Résumé : Les résultats de ces deux méthodes sont les mêmes, mais en termes de le processus opérationnel, La deuxième méthode, la méthode "node.classname", sépare l'écriture de css et de js, ce qui est évidemment plus raisonnable et ordonné. Si l'instruction CSS est relativement simple, il n'y a pas de différence entre les deux méthodes, mais si l'instruction CSS est relativement complexe, la deuxième méthode est évidemment plus méthodique.

Apprentissage recommandé :Tutoriel vidéo CSS

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!