แอตทริบิวต์ data ของ <object> คืออะไร?
แอตทริบิวต์ data ของแท็ก <object> ใช้สำห ระบุ URL ของทรัพยากร (Resource) ที่จะฝัง** เช่น ไฟล์เสียง วิดีโอ PDF Flash (SWF) รูปภาพ เป็นต้น
ไวยากรณ์ (Syntax)
<object data="URL"></object>
ตัวอย่างการใช้งาน
<!DOCTYPE html>
<html>
<body>
<h2>แอปพลิเคชันสาธิต CSS</h2>
<object data="https://www.example.com/flex/samples/CSSApplication.swf"
height="400" width="600">
</object>
</body>
</html>
ผลลัพธ์
จะแสดงแอปพลิเคชัน Flash (SWF) จาก URL ที่ระบุ ขนาด 600x400 พิกเซล
แอตทริบิวต์สำคัญของ <object>
| แอตทริบิวต์ | คำอธิบาย |
|---|---|
| data | URL ของทรัพยากรที่จะฝัง (Required) |
| type | MIME Type ของทรัพยากร (เช่น application/x-shockwave-flash) |
| width / height | ขนาดพิกเซลของพื้นที่ฝัง |
| name | ชื่อออบเจกต์ (สำหรับ scripting/form target) |
| usemap | ชื่อ Image Map (ถ้าเป็นรูปภาพ) |
| form | Form ID ที่ object เป็นส่วนหนึ่ง |
| typemustmatch | บังคับให้ type ตรงกับ Content-Type ของ Resource |
Fallback Content (เนื้อหาสำรอง)
<object data="video.mp4" type="video/mp4" width="640" height="360"> <!-- Fallback สำหรับเบราวเซอร์ที่ไม่รองรับ --> <p>เบราวเซอร์ของคุณไม่รองรับวิดีโอ MP4</p> <a href="video.mp4">ดาวน์โหลดวิดีโอ</a> </object>
จุดสำคัญ
dataคือแอตทริบิวต์หลักสำหรับระบุทรัพยากร- ควรระบุ
type(MIME) เสมอ เพื่อช่วยเบราวเซอร์ตัดสินใจ <object>ใช้ได้หลากหลาย: Images, Videos, Audio, PDF, SVG, Flash, Java Applets (เก่า)- แทนที่
<embed>,<applet>(ล้าสมัย),<iframe>(บางกรณี) - Flash (SWF) ล้าสมัยแล้ว ใช้ HTML5 Video/Canvas/WebGL แทน