Как создать: Синтаксисный выделитель

Узнайте, как создавать и использовать синтаксисные выделители.

Синтаксисный выделитель

Когда вы добавляете цвет к фрагментам кода, они становятся легче для чтения:

<!DOCTYPE html> <html> <body> <h1>Тестирование HTML_Syntax_Highlighter</h2> <p>Hello world!</p> <a href="https://www.codew3c.com">Вернуться в школу</a> </body> </html>









Как создать синтаксисный выделитель?


Первый шаг - добавьте HTML:


Содержит HTML-код <div>:


<div id="myDiv">
<!DOCTYPE html><br>
<html><br>
<body><br>
<br>
<h1>Тестирование HTML_Syntax_Highlighter</h2><br>
<p>Hello world!</p><br>
<a href="https://www.codew3c.com">Вернуться в школу</a><br>
<br>
</body><br>
</html>
</div>



Второй шаг - добавьте JavaScript:


Создайте функцию "w3CodeColor" и передайте ей элемент DIV в качестве аргумента для вызова:


w3CodeColor(document.getElementById("myDiv"));
function w3CodeColor(elmnt) {
  // Нажмите "Попробуйте сами", чтобы увидеть JavaScript...
}



Попробуйте сами