Modifier le style d'un élément HTML

On peut modifier dynamiquement le style de n'importe quel élément d'un document en changeant la valeur de sont attribut style.

Dans le code suivant, on change la taille de la police de caractères et la couleur d'un paragraphe :

<p id="para">
  Au fond d'un trou vivait un hobbit.
</p>
<script>
  let para = document.getElementById("para");
  para.style.fontSize = "150%";
  para.style.color = "green";
</script>

C'est exactement comme si on avait écrit ainsi le code HTML :

<p id="para" style="font-size: 150%; color: green;">
  Au fond d'un trou vivait un hobbit.
</p>

Comme on peut le remarquer ici, JavaScript n'utilise pas pour désigner les propriétés la même notation que CSS. Ainsi, font-size devient fontSize en JavaScript, tout comme background-color devient backgroundColor (notation dite lower camel case).