HTML data-* Attribute

HTML data-* Attribute - HTML data-* Attribute Digunakan untuk menentukan data tambahan pada sebuah element baik itu data berupa teks ataupun image, pengambilan data pada element data-* Attribute, bisa melalui fungsi CSS maupun java script. Dalam Penggunaan HTML data-* Attribute tidak dibolehkan menggunakan huruf kapital dan ada jarak spasi setelah kata data-.
Contoh penulisan yang benar :
data-nama, data-kelas, data-umur dan seterusnya.

Attribute Value:

Attribute	Value	Deskripsi
data-*	data value	Menentukan nama data setelah kata data-

Contoh penerapan HTML data-* Attribute

<ol>
  <li data-nama="data"> isi teks </li>
  <li data-jabatan="data"> isi teks </li>
</ol>

CSS yang diperlukan dari contoh html diatas

contoh css bersifat tidak mutlak

/* css [data-nama] */  
li[data-nama]:before {
  content: "Nama :";
  color : red;
  font-family:arial;
}

/* css [data-jabatan] */ 
li[data-jabatan]:before {
  content: "Jabatan :";
  color : blue;
  font-family:arial;
}

Browser Support:

Nilai pada tabel adalah minimal versi browser support untuk attibut data-*

HTML
Attribute	Chrome	Safari	Firefox	Opera	IE
data-*	4.0	3.1	2.0	9.6	5.5