สำหรับเรา ๆ ชาวโปรแกรมเมอร์คงต้องมีสักครั้งที่ต้องเขียนไฟล์ XML (ถ้าไม่เคยก็คงเพราะคุณอายุมากแล้ว (ใช้ CSV) ไม่ก็ยังเด็กเกินไป (ใช้ JSON)) XML เป็นเทคโนโลยีที่เกิดขึ้นเมื่อสักสิบปีที่แล้วเห็นจะได้ และถูกใช้ในกันอย่างกว้างขวาง จนพอจะเรียกได้ว่าใช้เยอะไปหน่อยก็คงได้มั้ง ??
XML เป็นเทคโนโลยีที่พัฒนามาจาก HTML 2.0 (ถ้าผมจำไม่ผิด) โดยการเปลี่ยนจากการใช้ชุดของ Tag ที่กำหนดตายตัว มาเป็นให้นักพัฒนาสร้างชุด Tag ขึ้นมาเอง ซึ่งการยอมให้นักพัฒนาสร้าง Tag ขึ้นมาในครั้งนี้มาพร้อมกับการลดความกำกวมที่มีในชุด Tag ของ HTML กล่าวคือใน XML ทุก Tag จะต้องมี Tag ปิดท้ายด้วยเสมอ เมื่อเทียบกับ HTML ที่บาง Tag นั้นไม่ต้องปิดก็ได้
ทีนี้มันก็จะมีบางงานที่เราต้องใช้ทั้ง HTML และ XML ในโปรเจคเดียวกัน … ที่จริงคือ มีเยอะเลยแหละ ก็บรรดา Web App จำนวนมากใช้ AJAX ในการแลกเปลี่ยนข้อมูล ความสับสนระหว่าง HTML และ XML นั้นเกิดขึ้นกับหลาย ๆ คน รวมทั้งผมด้วย (นี่ล่ะเหตุที่ผมเขียน Entry นี้) ลองดูโค๊ดข้างล่างนี้ก่อนนะครับ แล้วลองตอบตัวเองว่ามันมีปัญหาอะไร 🙂 (ให้เวลาคิด 15 วินาทีนะ)
<!doctype html>
<script src="jquery.js"/>
<h1>Spot the error!</h1>
บางคนคงบอกว่า ไม่ถูก หรือบางคนก็คงบอกว่า script ไม่มี language … สองอันนี้ถูกอยู่แล้วนะครับ (เป็นฟีเจอร์ของ HTML5) จุดที่ผิดอยู่ที่ <script src="jquery.js"/>
ครับ
ถ้าจะแก้ให้ถูกต้อง ต้องเขียนแบบนี้ครับ
<!doctype html>
<script src="jquery.js"></script>
<h1>Spot the error!</h1>
เห็นอะไรไหมครับ ? Tag <script>
นั้นจะต้องปิดด้วย </script>
เสมอ เพราะว่าจริง ๆ แล้ว Tag นี้ถูกระบุว่าควรมีเนื้อหาภายใน (แต่อันนี้ไม่มี 555)
แต่เหตุผลจริง ๆ ก็คงเป็นว่า ใน HTML ไม่มี self-closing tag ครับ ด้วยเหตุด้านความเข้ากันได้กับเวปเพจรุ่นเก่า ๆ โดยใน HTML นั้นจะมี Tag อยู่สองประเภท คือ Tag ที่อยู่ด้วยตัวมันเองได้ (ไม่มีเนื้อหาภายใน เช่น br, hr, link เป็นต้น) กับ Tag ที่ต้องมี Tag ปิด (มีเนื้อหาภายใน เช่น p, h1, small, i เป็นต้น)
ส่วน self-closing tag นั้นเป็นฟีเจอร์ของ XML ครับ
อธิบายต่อ ทีนี้ ถ้าเวปเรามี Tag ที่เป็น self-closing แล้วมันจะเป็นอย่างไร ? สำหรับนักพัฒนา XML ก็คงคิดว่า ตัว web browser นั้นจะปิดแท็กให้ … แต่ในความเป็นจริงแล้วตัว HTML parser จะมองว่า self-closing tag เป็นแค่ tag เปิดครับ และจะไม่ใส่ tag ปิดให้ (จนกระทั่งมันเริ่มรู้ว่ามี tag ที่เปิดค้างอยู่นั่นแหละ)
อย่างโค๊ดข้างล่างนี้ …
<!doctype html>
<script src="jquery.js"/>
<h1>Spot the error!</h1>
จะถูก parse กลายเป็น
<!doctype html>
<script src="jquery.js">
<h1>Spot the error!</h1>
</script>
ความหมายผิดไปเลย เห็นไหมครับ ?
ผมคิดว่าทุกคนคงจะเห็นแล้วว่าปัญหาอยู่ที่ตรงไหน เชื่อไหมครับผมใช้เวลาเกือบครึ่งเดือนหาว่าบั๊กที่ผมเจอนั้นเกิดจากอะไรจนมารู้เรื่องนี้แหละ รู้สึกเหมือนถูกตีหัวแรง ๆ เลยครับ 555
บางคนคงคิดเหมือนกันว่าทำไมเราถึงไม่มี HTML ในรูปของ XML อันที่จริงมันก็มีครับ ชื่อว่ามาตรฐาน XHTML แต่ว่ามาตรฐานนี้แท้งไปแล้ว เพราะว่าพัฒนานานเกินและผู้ผลิต Browser ดูจะไม่ค่อยจริงจังกับมันเท่าไหร่ (ทั้ง ๆ ที่ความจริงถ้ามาตรฐานนี้ผ่าน ตัว Parser จะทำงานง่ายมากเลย และความเร็วในการอ่าน Parse จะเร็วขึ้นอย่างเห็นได้ชัด) สุดท้ายก็เลยมีแค่ HTML 5 ที่อยู่รอดมาจนถึงปัจจุบันนี้ครับ