แนวทางที่จะสร้าง: Highlighter ภาษา

เรียนรู้ว่าจะสร้างและใช้ Highlighter ภาษา

Highlighter ภาษา

เมื่อคุณเพิ่มสีบางตัวให้กับบทความรหัส มันจะง่ายต่อการอ่าน:

<!DOCTYPE html> <html> <body> <h1>ทดสอบ HTML Syntax Highlighter</h2> <p>Hello world!</p> <a href="https://www.codew3c.com">กลับสู่โรงเรียน</a> </body> </html>

แนวทางที่จะสร้าง Highlighter ภาษา

ขั้นที่ 1 - เพิ่ม HTML:

div ที่มีรหัส HTML:

<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>

ขั้นที่ 2 - เพิ่ม JavaScript:

สร้างฟังก์ชัน "w3CodeColor" และใช้ตัวแทน DIV ในการเรียกใช้งานมัน:

w3CodeColor(document.getElementById("myDiv"));
function w3CodeColor(elmnt) {
  // คลิก "จับตาดูด้วยตัวเอง" ที่นี่เพื่อเห็น JavaScript...
}

亲自试一试