Attribute

Es sollten keine eigenen HTML-Attribute mit beliebigen Namen mehr benutzt werden. In HTML5 gibt es sogenannte data-Attribute, die stattdessen genutzt werden können. Diese beginnen mit der Vorsilbe data-. Beispielsweise ist data-price als Attributname in Ordnung, nicht aber price.

Im Bereich Attribute können einem Formularelement HTML-Attribute hinzugefügt werden, auf diese dann später wieder im Skriptbereich per Javascript zugegriffen werden kann. Neben eigenen Attributen können auch bestehende HTML-Attribute überschrieben werden, etwa das Attribut type für Input-Elemente.

In diesem Bereich können beliebige HTML-Attribute vergeben werden. Dies eignet sich für fortgeschrittene Anwendungen.

Die eingegebenen Attribute werden als HTML-Attribute an dem jeweiligen Element hinterlegt.

Hinzufügen eines Attributs

Um ein HTML-Attribut hinzuzufügen, tragen Sie einfach in der Spalte Attribut den Namen des HTML-Attributs und in die Spalte Wert den gewünschten Wert ein. Nach der Eingabe wird automatisch eine neue Zeile für weitere Attribute eingefügt.

Löschen eines Attributs

Ein vorhandenes Attribut wird über das Icon links gelöscht.

Zugriff auf Data-Attribute mittels JavaScript

Um an einem Element zusätzliche Daten zu hinterlegen, gibt es die sogenannten Data-Attribute. Diese sollten im Namen keine Großbuchstaben enthalten, zudem sollten Wörter durch Bindestriche getrennt werden. Etwa data-serial-version ein guter Attributname, dataSerialVersion hingegen nicht. Beim Zugriff mittels JavaScript werden die Bindestriche entfernt und die Anfangsbuchstaben der Wörter in Großbuchstaben umgewandelt.

Angenommen, am Element tfSerialVer wurde für das Attribut data-serial-version wurde der 1aFXc gesetzt. Dann geschieht der Zugriff über JavaScript wie folgt:

const serialVersion = $("[name='tfSerialVer']").data("serialVersion");
console.log("Serial version ist:" , serialVersion);