Drei Vorteile für aktuelle Browser mit HTML 5

data-*-Attribute nutzen

Mit data-*-Attributen kann man unsichtbare Daten in ein HTML-Element schreiben. Das Sternchen steht dabei für eine beliebige Zeichenkette, was bedeutet, man kann eigene HTML-Attribute einführen. Im Einsatz könnte das Ganze beispielsweise so aussehen:

<ul id="metal">

<li data-artist="Judas Priest" data-album="Painkiller">Painkiller</li>

<li data-artist="Metallica" data-album="Ride the Lightning">For Whom the Bell Tolls</li>

<li data-artist="Iron Maiden" data-album="The Number of The Beast">Run to the Hills</li>

</ul>

data-*-Attribute verwendet man zur Ausgabe der Informationen im Browser per JavaScript. Die benötigten Informationen baut man am besten noch während der Erzeugung der Seite durch ein PHP-Script ein. HTML5 sieht für die richtige Ausgabe eine eigene JS-Schnittstelle vor. Diese ist zwar noch in keinem Browser implementiert, doch muss kein Hindernis sein: die data-*-Attribute sind schließlich ganz normale HTML-Attribute und können entsprechend auch ohne spezialisierte API ausgelesen werden:

var titel = document.getElementsByTagName('li');

for(var i = 0; i < titel.length; i++)

{

alert(titel[i].innerHTML + 'von' + titel[i].getAttributeNode('data-artist').value + ' stammt vom Album ' + titel[i].getAttributeNode('data-album').value);

}

Übrigens: innerHTML wird mit HTML5 auch Bestandteil des Webstandards-Kanon und keine Nichtstandard-Funktion mehr.

Fazit

HTML5 wurde speziell für interaktive Webapplikationen entworfen und weniger für normale Webseiten wie den Internetauftritt der mittelständischen Beispielmüller GmbH. Die neue Hypertext-Auszeichnungssprache bringt aber Vorteile für Benutzer sowie Entwickler: Die ersten erleben mehr Komfort beim Surfen im Web, für die Webentwickler ersparen sich viele der unnötigen Handgriffe. (Macwelt/mje)