如何創建：語法高亮器

學習如何創建和使用語法高亮器。

語法高亮器

當你為代碼片段添加一些顏色時，它們會更容易閱讀：

<!DOCTYPE html> <html> <body> <h1>Testing an HTML Syntax Highlighter</h2> <p>Hello world!</p> <a href="https://www.codew3c.com">Back to School</a> </body> </html>









如何創建語法高亮器


第一步 - 添加 HTML：


包含 HTML 代碼的 <div>：


<div id="myDiv">
<!DOCTYPE html><br>
<html><br>
<body><br>
<br>
<h1>Testing an HTML Syntax Highlighter</h2><br>
<p>Hello world!</p><br>
<a href="https://www.codew3c.com">Back to School</a><br>
<br>
</body><br>
</html>
</div>



第二步 - 添加 JavaScript：


創建一個名為 "w3CodeColor" 的函數，并使用 DIV 元素作為參數來調用它：


w3CodeColor(document.getElementById("myDiv"));
function w3CodeColor(elmnt) {
  // click "Try it Yourself" to see the JavaScript...
}



親自試一試