การปรับปรุงคุณสมบัติ IE8 สำหรับนักพัฒนาเว็บ

ผู้เขียน：Eve Cole เวลาอัปเดต：2009-07-03 17:12:46

เมื่อวันที่ 20 มีนาคม พ.ศ. 2552 Microsoft ได้เปิดตัว Windows Internet Explorer 8 (IE8) เวอร์ชันอย่างเป็นทางการไปทั่วโลก ซึ่งกลายเป็นจุดสนใจของผู้คน IE8 เป็นเวอร์ชันที่ตรงตามมาตรฐานมากที่สุดในปัจจุบัน รองรับ Cascading Style Sheets (CSS) ระดับ 2.1 อย่างสมบูรณ์ มีการปรับปรุงการรองรับ CSS 3, HTML 4.01 และยังสามารถรองรับ HTML 5 ได้ดีอีกด้วย ด้วยการสนับสนุนที่ดีขึ้นสำหรับองค์ประกอบ HTML เหล่านี้ นักพัฒนาเว็บจึงสามารถสร้างมาร์กอัป HTML ที่ชัดเจนและเข้าถึงได้มากขึ้น บทความนี้จะสำรวจการเปลี่ยนแปลงพฤติกรรมการรองรับ HTML และ CSS ใน IE8 และการเปลี่ยนแปลงเหล่านี้ส่งผลต่อนักพัฒนาเว็บอย่างไร

การปรับปรุง HTML

เพื่อช่วยให้นักพัฒนาใช้ประโยชน์จากองค์ประกอบต่างๆ ที่ได้รับจาก HTML 4.01 ได้อย่างเต็มที่ และตีความความหมายเชิงความหมายที่นักพัฒนาเว็บคาดหวังจะแสดงได้ดีขึ้น Windows Internet Explorer จึงได้รับการอัปเกรดโดยรองรับองค์ประกอบการนำเสนอต่อไปนี้:

องค์ประกอบ P : หมายถึงย่อหน้าแบบลอจิคัล
องค์ประกอบ OBJECT : สามารถแสดงถึงวัตถุใดๆ รวมถึงรูปภาพด้วย
องค์ประกอบ ปุ่ม ส่งแอตทริบิวต์ค่าของมันแทน innerHTML ซึ่งหมายความว่าองค์ประกอบปุ่มในขณะนี้สามารถใช้รูปแบบรูปแบบข้ามเบราว์เซอร์
ขณะนี้เมธอด getElementByIdNAME คำนึงถึงขนาดตัวพิมพ์และไม่ใช้แอตทริบิวต์สำหรับการค้นหาที่ไม่เหมาะสมอีกต่อไป
ขณะนี้เมธอด setAttribute ไม่คำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่ ซึ่งหมายความว่าคุณไม่จำเป็นต้องใช้ตัวพิมพ์ "camelCase" (เช่น "camelCaseWord") อีกต่อไปเมื่อระบุแอตทริบิวต์ นอกจากนี้ยังระบุแอตทริบิวต์ HTML เช่น CLASS และ FOR ได้อย่างถูกต้องอีกด้วย

P เพิ่มแท็กปิดองค์ประกอบโดยอัตโนมัติ

องค์ประกอบ P ที่ไม่มีแท็กปิดจะเพิ่มแท็กปิดโดยอัตโนมัติทันทีเมื่อตามด้วยองค์ประกอบ TABLE, FORM, NOFRAMES หรือ NOSCRIPT

<html>
<หัว>
<title>ตัวอย่างส่วนท้ายขององค์ประกอบ P แบบง่าย</title>
<meta http-equiv="X-UA-Compatible" content="IE8"/>
</หัว>
<ร่างกาย>

<p>นี่คือย่อหน้าแรก</p>

<p style="margin-left:30px">นี่คือย่อหน้าที่สอง 

<table border="1px" cellpadding="2px"><tr><td>นี่คือเซลล์ตาราง </td></tr></table>

<p>นี่คือย่อหน้าที่สาม </p>

</ร่างกาย>
</html>

ในตัวอย่างนี้ องค์ประกอบ P ที่สองไม่มีแท็กปิด เมื่อดูโดยใช้ Windows Internet Explorer 7 องค์ประกอบ TABLE จะปรากฏเป็นองค์ประกอบย่อยขององค์ประกอบ P ที่สอง องค์ประกอบ P ที่สองถูกเยื้อง 30 พิกเซลจากขอบด้านซ้ายของหน้าต่าง เนื่องจาก TABLE เป็นองค์ประกอบลูกขององค์ประกอบ P จึงถูกเยื้องจากระยะขอบด้านซ้ายของหน้าต่างด้วย อย่างไรก็ตาม เมื่อดูในโหมดเริ่มต้นของ Windows Internet Explorer 8 องค์ประกอบ TABLE จะจัดชิดกับระยะขอบด้านซ้าย เนื่องจาก Windows Internet Explorer 8 จะเพิ่มแท็กปิดที่หายไปขององค์ประกอบ P โดยอัตโนมัติก่อนที่จะแสดงองค์ประกอบ TABLE องค์ประกอบ TABLE จึงไม่ใช่องค์ประกอบลูกขององค์ประกอบ P ที่สองใน IE8

แสดงภาพโดยใช้องค์ประกอบ OBJECT

Windows Internet Explorer 8 สามารถแสดงภาพโดยใช้องค์ประกอบ OBJECT เมื่อใช้องค์ประกอบนี้เพื่อแสดงรูปภาพในเบราว์เซอร์รุ่นเก่า มักจะเพิ่มแถบเลื่อนและเส้นขอบให้กับรูปภาพโดยอัตโนมัติ ซึ่งมักจะทำให้รูปภาพแสดงไม่ถูกต้อง

ใน Windows Internet Explorer 8 องค์ประกอบ OBJECT จะแสดงรูปภาพเหมือนกับว่าถูกฝังโดยใช้องค์ประกอบ IMG หากต้องการใช้ลักษณะการทำงานนี้ในหน้าเว็บ ให้ตั้งค่าแอตทริบิวต์ DATA ขององค์ประกอบ OBJECT เป็น URL ของรูปภาพ คุณยังสามารถฝัง dataURL ในแอตทริบิวต์ DATA ได้ด้วย
หากต้องการให้ Windows Internet Explorer โหลดรูปภาพลงในองค์ประกอบ OBJECT ที่ใช้ลักษณะการทำงานแบบเก่า ให้เลือกโหมดความเข้ากันได้แบบเก่าสำหรับเว็บเพจ หรือตั้งค่าแอตทริบิวต์ TYPE ขององค์ประกอบ OBJECT เป็น text/html