react-web-tutorial/react-tuto/restes section 2/25. Manipuler les styles.md

On continue sur l'exemple précédent. À la fin du script, ajoute :

var items = document.getElementsByTagName('li');
for(var i = 0 ; i < items.length ; i++) {
  items[i].style.color = 'white';
  items[i].style.background = '#89a';
  items[i].style['font-weight'] = 'bold';
}

• Remarque qu'on a bouclé sur items exactement comme on l'aurait fait avec un tableau. Pour autant, ce n'est pas un tableau, et des méthodes marchant sur un tableau ne marcheraient pas ici.
• On affecte individuellement les propriétés de style. Elles doivent te rappeler quelque chose puisque tu connais CSS !
• Note qu'on a utilisé deux façons de définir des couleurs :
  • En utilisant une couleur "standard" comme 'white'.
  • En utilisant un code couleur hexadécimal.
• On ne peut pas utiliser n'importe quels caractères pour manipuler une propriété via le . suivi du nom. Le - n'est pas autorisé, on utilise donc la variante entre crochets pour assigner le style gras.