J'ai appris qu'il existe des moyens de changer la couleur des textes individuels. Cependant, j'aimerais savoir comment changer la couleur de tous les textes de mon site Web en même temps.

J'ai trouvé la fonction document.body.style.backgroundColor = "black"; et j'espérais qu'il y aurait quelque chose de similaire pour les polices.

Edit: je suis désolé. Je suppose que je trompais certaines personnes. Je sais ce qu'est CSS bien sûr ... Je voulais trouver un moyen de changer les couleurs en utilisant le site Web. J'aimerais donc trouver un moyen de modifier les propriétés CSS via JavaScript.

-1
oRookie 8 août 2016 à 18:31

3 réponses

Meilleure réponse

Utilisez la propriété CSS color CSS:

CSS

* {
   color:  [color-value];
}

Cela changera la couleur de police de tous les éléments à l'aide du sélecteur universel (*). Si nécessaire, vous devrez peut-être utiliser la !important déclaration (non recommandé, mais utile: voir le lien) pour remplacer d'autres styles.

JavaScript

document.body.style.color = [color-value];
5
miken32 27 sept. 2017 à 00:14

Si vous voulez vraiment changer la couleur de tout le texte d'une page Web en utilisant Javascript, alors j'utiliserais le code suivant

var all = document.getElementsByTagName("*");

for (var i=0, max=all.length; i < max; i++) {
 all[i].style.color = "red";
}
<div>This is text that will change colors!</div>
<div id="SomethingOtherAnswersWontChange"><span style="color:green;">Other answers will leave this text green.</span></div>

Ce n'est pas exactement optimal, mais il est robuste. Ce code changera la police / couleur du texte de chaque élément. Pour ce faire, il parcourt chaque élément de la page Web et modifie le style des éléments pour appliquer l'attribut CSS "color: red;" .

Il est important de garder à l'esprit que pour les très grandes pages Web, cette méthode peut être un peu lente, mais elle devrait faire le travail.

Remarque : Je ne suis pas sûr à 100%, mais les classes CSS circonstancielles comme a:hover pourraient ne pas être affectées par cela.

6
Spencer D 10 août 2016 à 16:41

Utilisez .color au lieu d'utiliser .backgroundColor.

document.body.style.color = "red";
<div>This is text that will change colors!</div>

Comme indiqué dans les commentaires ci-dessus, vous devriez vraiment penser à utiliser CSS comme ceci:

body{
  color:red;  
}
<div>This is text that will change colors!</div>
0
Wowsk 8 août 2016 à 15:33