Comment créer : Surligneur de syntaxe

Apprenez à créer et à utiliser un surligneur de syntaxe.

Surligneur de syntaxe

Quand vous ajoutez de la couleur aux fragments de code, ils deviennent plus faciles à lire :

<!DOCTYPE html> <html> <body> <h1>Test d'un surligneur de syntaxe HTML</h2> <p>Bonjour le monde!</p> <a href="https://www.codew3c.com">Retour à l'école</a> </body> </html>









Comment créer un surligneur de syntaxe


Première étape - Ajoutez HTML :


Div contenant du code HTML :


<div id="myDiv">
<!DOCTYPE html><br>
<html><br>
<body><br>
<br>
<h1>Test d'un surligneur de syntaxe HTML</h2><br>
<p>Bonjour le monde!</p><br>
<a href="https://www.codew3c.com">Retour à l'école</a><br>
<br>
</body><br>
</html>
</div>



Deuxième étape - Ajoutez JavaScript :


Créez une fonction nommée "w3CodeColor" et utilisez l'élément DIV en tant que paramètre pour l'appeler :


w3CodeColor(document.getElementById("myDiv"));
function w3CodeColor(elmnt) {
  // cliquez sur "Essayez par vous-même" pour voir le JavaScript...
}



Essayer par vous-même