Custom Data Attribute เป็นความสามารถใหม่ใน html5 ช่วยให้การ Embed ข้อมูลต่างๆ ไว้ใน HTML Element ทำได้สะดวกยิ่งขึ้น ซึ่งประกอบไปด้วย 2 ส่วน ดังนี้
Attribute Name ต้องขึ้นต้นด้วย “data-” แล้วตามด้วยชื่ออะไรก็ได้ที่เราต้องการ ความยาวอย่างน้อย 1 ตัวอักษร และเป็น lower case
Attribute Value เป็นค่าอะไรก็ได้ ที่เราต้องการเก็บ
ตัวอย่างการใช้งาน Custom Data Attribute
<ul id="vegetable-seeds">
<li data-spacing="10cm" data-sowing-time="March to June">Carrots</li>
<li data-spacing="30cm" data-sowing-time="February to March">Celery</li>
<li data-spacing="3cm" data-sowing-time="March to September">Radishes</li>
</ul>
จากตัวอย่างด้านบน เราต้องการแสดงรายชื่อคน 3 คน ได้แก่ Ball, Pla และ Tae แต่เราต้องการให้ Application รู้ด้วยว่า แต่ละคนมีชื่อจริงและเพศเป็นอะไร โดยที่ไม่ได้ต้องการให้แสดงผลออกมา กรณีเราจะใช้ Custom Data Attribute มาช่วยครับ ส่วนวิธีการนำค่าที่เก็บไว้มาใช้งาน ก็สามารถทำได้ง่าย ดังนี้ครับ
สรุปเกี่ยวกับการใช้ Custom Data Attribute
- สามารถดึงข้อมูลจาก HTML Element ได้โดยตรง ทำให้ไม่ต้องพึ่ง Ajax Call และ Server-Side Script ในการเชื่อมต่อฐานข้อมูล
- Custom Data Attribute ถูกออกแบบมาเพื่อใช้เก็บข้อมูลสำหรับหน้า หรือ Application นั้นๆ เท่านั้น ไม่ใช่ Application ภายนอก ซึ่งตรงข้ามกับ Microformat
- ไม่ควรใช้ Custom Data Attribute ในการอ้างอิงสำหรับใส่ Stylesheet ใดๆ จะใช้ Custom Data Attribute ก็ต่อเมื่อไม่มี Attribute หรือ HTML Element อื่นๆ ที่เหมาะสมกว่าแล้ว
รับทําเว็บไซต์ 
แลกลิงค์ 
