JavaScript >> Tutoriel Javascript >  >> Tags >> CSS

Meilleur moyen de partager des constantes entre Javascript et CSS

Je crée un site Web avec beaucoup de choses dynamiques présentées en javascript, ainsi qu'en CSS. Ce qui me dérange, c'est que la moitié de mes constantes de dimension (positions et tailles des choses sur la page) sont dans mon javascript, alors que d'autres sont dans mon CSS. Existe-t-il un bon moyen d'avoir une "place unique" pour des constantes comme celle-ci ?

J'ai d'abord pensé que je pouvais utiliser un générateur CSS comme LessCss ou SASS, mais dans la documentation de ceux-ci, je ne vois aucun moyen d'accéder aux constantes déclarées à partir d'un autre fichier javascript non plus. Quelqu'un peut-il m'indiquer une manière claire et idiomatique de gérer ce problème ?

Merci pour toute aide !

MODIFIER :

Pour clarifier mon problème :une partie de ma page consiste en un composant de feuille de calcul hautement spécialisé que j'ai construit à partir de zéro en javascript pour s'exécuter dans un élément canvas. J'ai beaucoup de constantes de mise en page liées à ce composant, telles que cell_width, cell_height, etc. qui ne sont pas des propriétés CSS standard. D'autres composants de mon site Web sont plus typiques et sont stylisés par CSS. Ce que je me demande, c'est s'il existe un moyen accepté de conserver un seul endroit pour conserver mes constantes de style CSS et Javascript en un seul endroit. Cela pourrait être en conservant d'une manière ou d'une autre des propriétés "personnalisées" dans mon CSS qui ne sont utilisées que pour les lire via javascript. Ou, si LessCss ou SASS ont un moyen de définir des variables via mon propre javascript avant le rendu, cela fonctionnerait également. Cependant, je n'ai trouvé aucune information en ligne sur l'un ou l'autre de ces sujets.

Répondre

Existe-t-il un bon moyen d'avoir une "place unique" pour des constantes comme celle-ci ?

La feuille de style.

Définissez ensuite dynamiquement les noms de classe.

(Au moins dans de nombreux cas. Nous ne connaissons pas les détails de votre problème)