HTML5 Logo Ein neues Feature von HTML5 sind frei wählbare data-Attribute für HTML-Elemente, die sogenannten „Custom Data Attributes”.

Die Idee ist dahinter ganz einfach: Man möchte eigene Daten an einem HTML-Element abspeichern, für die es kein vorgefertigtes Attribut gibt und die auch nicht direkt im Frontend zu sehen sein sollen. Insgesamt ein sehr nützliches Features, das im Folgenden vorgestellt wird.

data-* Attribute

Man kann in einem HTML-Element ein eigenes Attribut definieren, indem man mit dem vorgegebenen Präfix data- beginnt und anschließend mit einer frei wählbaren Bezeichnung endet (z.B. data-release-year). Im Folgenden ein Beispiel, das einige Beatles-Alben mit dem Erscheinungsjahr versieht. Dabei handelt es sich um validen HTML5-Code (und dies ganz ohne eigenen Namespaces oder Doctype).

HTML:
    •   data-release-year="1969">Yellow Submarine
  1.   data-release-year="1969">Abbey Road
  2.   data-release-year="1970">Let It Be
  3.