การเพิ่มคอมเมนต์ในโค้ดเป็นวิธีที่ช่วยให้คุณหรือผู้อื่นเข้าใจว่าโค้ดทำอะไร โค้ดหรือข้อความที่ถูกคอมเมนต์จะถูกเบราว์เซอร์เพิกเฉย
อ่านต่อเพื่อดูวิธีสร้างคอมเมนต์ใน HTML, CSS และ JavaScript!
วิธีเขียนคอมเมนต์ใน HTML
คอมเมนต์ HTML บรรทัดเดียว
เพื่อคอมเมนต์บรรทัดเดียวของ HTML ให้วางข้อความหรือโค้ดที่ต้องการคอมเมนต์ไว้ระหว่างแท็กคอมเมนต์: <!-- -->
ตัวอย่างในโค้ด:
<!-- The text in here will be invisible on the website --> <div class="content"> Here's some regular HTML content! </div>
เมื่อโหลดเว็บไซต์ คอมเมนต์ HTML จะไม่แสดงบนหน้าเว็บ:
แต่ถ้าตรวจสอบโค้ดเว็บไซต์ในเบราว์เซอร์ คุณยังคงเห็นข้อความคอมเมนต์ HTML:
คอมเมนต์ HTML หลายบรรทัด
เพื่อสร้างคอมเมนต์แบบบล็อกหรือหลายบรรทัดใน HTML ยังใช้แท็กคอมเมนต์ <!-- --> แต่สามารถมีหลายบรรทัดได้ ตราบใดที่ข้อความคอมเมนต์อยู่ระหว่างแท็ก จะถูกรวมในคอมเมนต์
ตัวอย่างคอมเมนต์ HTML หลายบรรทัด:
<!-- The text in here will be invisible on the website! Here's another line of the comment. You can have as many lines as you want! 😁 --> <div class="content"> And here's that regular HTML content again. </div>
ลักษณะบนเว็บไซต์:
และเห็นคอมเมนต์ HTML ทั้งหมดใน Inspector:
วิธีเขียนคอมเมนต์ใน CSS
คอมเมนต์ CSS บรรทัดเดียว
เพื่อสร้างคอมเมนต์ CSS บรรทัดเดียว ให้วางข้อความหรือโค้ดระหว่างแท็ก /* */
ตัวอย่าง:
/* This text will be ignored by the browser! */ .description { font-size: 1rem; line-height: 1.25rem; color: #202020; }
คอมเมนต์ CSS หลายบรรทัด
เพื่อเขียนคอมเมนต์ CSS แบบบล็อกหลายบรรทัด ใช้แท็ก /* */ เดียวกัน วางเนื้อหาคอมเมนต์หลายบรรทัด
ตัวอย่างคอมเมนต์ CSS หลายบรรทัด:
/* This text will be ignored by the browser! And this will also be included in the comment! One last line of comment for good measure 😁 */ .description { font-size: 1rem; line-height: 1.25rem; color: #202020; }
วิธีเขียนคอมเมนต์ใน JavaScript
คอมเมนต์ JavaScript บรรทัดเดียว
เพื่อสร้างคอมเมนต์บรรทัดเดียวใน JavaScript ให้เริ่มบรรทัดด้วยสองเครื่องหมายทับหน้า (//)
ตัวอย่าง:
// This text is a comment and will be ignored!
คุณยังสามารถเพิ่มคอมเมนต์บรรทัดเดียวในบรรทัดเดียวกับโค้ดได้ ตราบใดที่คอมเมนต์เป็นเนื้อหาสุดท้ายของบรรทัดนั้น
ตัวอย่าง:
console.log('Test code here!'); // This is a console log message
คอมเมนต์ JavaScript หลายบรรทัด
หากต้องการสร้างคอมเมนต์แบบบล็อกหลายบรรทัดใน JavaScript ให้ล้อมข้อความคอมเมนต์ด้วยแท็ก /* */ (วิธีเดียวกับ CSS)
ตัวอย่าง:
/* Function: doSomeAwesomeThing() This does something awesome, but I don't know what! */ function doSomeAwesomeThing(){ console.log('Run awesome function'); }
สรุป
การเพิ่มคอมเมนต์ในโค้ด HTML, CSS และ JavaScript จะช่วยให้ผู้อื่นเข้าใจโค้ดของคุณ
ยังช่วยเมื่อพัฒนาโปรเจกต์และต้องคอมเมนต์โค้ดบางส่วนชั่วคราวขณะทดสอบ แต่อย่าปล่อยคอมเมนต์ไว้ในโค้ด production!