การสร้างเว็บเพจขึ้นมาใหม่ซัก 1 หน้านั้นเราจำเป็นต้องระบุ DOCTYPE เพื่อเป็นการระบุว่าเอกสารนี้อยู่ในรูปแบบใด เพื่อให้ Browser ทั้งหลายแหล่ทราบทันทีว่าหากมี DOCTYPE จะอ่านและตีความเว็บเพจนั้นด้วยวิธีการใด (เช่นเป็น html 4 หรือ html 5 เป็นต้น)
ยกตัวอย่างการเขียน html 5 นั้น การใส่ code สามารถใส่ได้ดังนี้
<!DOCTYPE HTML>
<html>
<head>
<title>การสร้างเอกสาร html 5</title>
<meta charset="UTF-8">
</head>
<body>
Content HTML 5
</body>
</html>
หมายเหตุ หากต้องการทราบรายละเอียดว่า html 5 ต่างกับ html 4 อย่างไร ให้เข้าไปดูที่
http://www.w3.org/TR?html5-diff/
ทีนี้จะมาอธิบายเรื่อง Browser Mode ว่ามันมีผลกับ DOCTYPE ที่กำหนดในเอกสารอย่างไร
Browser Mode จะมี 2 แบบ คือ Quicks mode กับ Standard mode ซึ่งหมายถึงโหมดที่ไม่มาตรฐานกับโหมดมาตรฐานตามลำดับ (ก็แน่ล่ะ ชื่อก็บอกซะขนาดนั้น - -*)
Qucik mode คือ หาก Browser ไม่สามารถตรวจสอบได้ว่าเว็บเพจที่กำลังเปิดอยู่นี้เป็น DOCTYPE ประเภทไหน ก็ไม่รู้ว่าจะเอารูปแบบใดมาใช้ตีความโค้ดต่าง ๆ บนเว็บเพจ จึงกลับไปใช้การอ่านและตีความตามเว็บเพจรุ่นเก่า ซึ่งผลที่ตามมาคือ รูปแบบการอ่านและตีความของแต่ละ Browser จะไม่เหมือนกัน เช่น IE จะตีความแต่ละแท็กต่างจาก Firefox หรือมีวิธีการตีความ CSS ที่แตกต่างกัน
Standard mode คือ โหมดการทำงานที่ Browser ทราบรูปแบบของเว็บเพจนี้ว่าอยู่ในมาตรฐานใด เป็น DOCTYPE แบบไหน จึงสามารถอ่านและตีความโค้ดในเว็บเพจนี้ได้ ซึ่งหากอยู่ในโหมดนี้ การตีความก็จะเป็นตามมาตรฐานเดียวกันในทุก ๆ Browser
การกำหนด DOCTYPE ในบรรทัดแรกนั้น หากเรากำหนดถูกต้องและ Browser รู้จักประเภท DOCTYPE ก็จะอยู่ในโหมด Standart mode แต่หากไม่กำหนดหรือโค้ดผิด ก็จะเข้าสู่ Quick mode โดยทันที
เราสามารถเขียน Javascript เพื่อตรวจสอบว่าเอกสารอยู่ในโหมดไหน โดยใช้คำสั่ง document.compactMode ลองดูตามตัวอย่าง
<!DOCTYPE HTML>
<html>
<head>
<title>การสร้างเอกสาร html 5</title>
<meta charset="UTF-8">
</head>
<body>
Content HTML 5
<script>
if(document.compactMode == 'CSS1compat')
{
alert("โหมดที่ใช้งานคือ Standard mode");
}
else
{
alert("โหมดที่ใช้งานคือ Quick mode");
}
<scrpit>
</body>
</html>
จากโค้ดด้านบนลองเอา <!DOCTYPE HTML> ออกดูก็ได้ จะเห็นว่าจะเข้าสู่โหมด Quick mode ทันที เรื่องจาก Browser ไม่สามารถตีความได้
ไม่มีความคิดเห็น:
แสดงความคิดเห็น