Cómo crear: Resaltador de sintaxis

Aprende a crear y usar un resaltador de sintaxis.

Resaltador de sintaxis

Cuando agregas algunos colores a los fragmentos de código, se vuelven más fáciles de leer:

<!DOCTYPE html> <html> <body> <h1>Probando un resaltador de sintaxis de HTML</h2> <p>Hola mundo!</p> <a href="https://www.codew3c.com">Volver a la Escuela</a> </body> </html>









Cómo crear un resaltador de sintaxis


Primer paso - Añadir HTML:


Un <div> que contiene código HTML:


<div id="myDiv">
<!DOCTYPE html><br>
<html><br>
<body><br>
<br>
<h1>Probando un resaltador de sintaxis de HTML</h2><br>
<p>Hola mundo!</p><br>
<a href="https://www.codew3c.com">Volver a la Escuela</a><br>
<br>
</body><br>
</html>
</div>



Segundo paso - Añadir JavaScript:


Cree una función llamada "w3CodeColor" y utilice el elemento DIV como parámetro para invocarla:


w3CodeColor(document.getElementById("myDiv"));
function w3CodeColor(elmnt) {
  // haga clic en "Prueba tú mismo" para ver el JavaScript...
}



Prueba por tu cuenta