Signatur
Beschreibung
HTMLElement.accessKeyLabel gibt einen String zurück, der beschreibt, mit welcher vollständigen Tastenkombination der Browser den über das HTML-Attribut accesskey festgelegten Zugriffsschlüssel auslöst. Hat das Element keinen Zugriffsschlüssel, ist der Wert ein leerer String "".
Der Unterschied zu HTMLElement.accessKey: accessKey enthält nur das vom Autor gesetzte Zeichen (z. B. "s"), während accessKeyLabel die tatsächliche, plattform- und browserabhängige Kombination inklusive Modifikatortasten liefert – etwa "Alt+Shift+S" in Firefox unter Windows/Linux oder "⌃⌥S" unter macOS.
Nützlich ist die Eigenschaft vor allem, um Nutzern korrekte Hinweise auf Tastenkürzel anzuzeigen, etwa in einem title-Tooltip oder einer Hilfeseite, statt eine Kombination zu raten, die auf dem jeweiligen System gar nicht stimmt.
Die Eigenschaft ist schreibgeschützt; um den Zugriffsschlüssel zu ändern, setzt man element.accessKey bzw. das Attribut accesskey.
Rückgabewert
"", wenn kein Zugriffsschlüssel gesetzt ist. In Browsern ohne Unterstützung ist die Eigenschaft undefined.Beispiele
Tastenkombination eines Buttons auslesen
// HTML: <button id="save" accesskey="s">Speichern</button>
const btn = document.getElementById('save');
console.log(btn.accessKey); // vom Autor gesetztes Zeichen
console.log(btn.accessKeyLabel); // vom Browser zugewiesene KombinationTooltip mit korrektem Tastenkürzel erzeugen (mit Fallback)
// Allen Elementen mit accesskey einen passenden Tooltip geben
const describeShortcut = (el) => {
// Chromium kennt accessKeyLabel nicht -> undefined
const label = typeof el.accessKeyLabel === 'string' && el.accessKeyLabel !== ''
? el.accessKeyLabel
: `Zugriffstaste: ${el.accessKey.toUpperCase()}`;
return label;
};
document.querySelectorAll('[accesskey]').forEach((el) => {
const base = el.title || el.textContent.trim();
el.title = `${base} (${describeShortcut(el)})`;
});Leerer String ohne Zugriffsschlüssel und nach Änderung
const link = document.createElement('a');
link.href = '/hilfe';
link.textContent = 'Hilfe';
document.body.append(link);
console.log(JSON.stringify(link.accessKeyLabel)); // noch kein accesskey
link.accessKey = 'h'; // accessKeyLabel selbst ist schreibgeschützt
console.log(link.accessKeyLabel);// Wichtig · Fallstricke
- Browser-Unterstützung: Firefox und Safari unterstützen die Eigenschaft, Chrome, Edge und andere Chromium-Browser nicht. Dort ist
el.accessKeyLabelundefined. Vor der Nutzung also immer auftypeof el.accessKeyLabel === 'string'prüfen und aufaccessKeyzurückfallen. - Das Format ist nicht standardisiert und hängt von Browser, Betriebssystem und Tastaturbelegung ab (
"Alt+Shift+S","⌃⌥S"…). Den String nur anzeigen, nicht parsen. - Die Eigenschaft ist schreibgeschützt: Zuweisungen werden stillschweigend ignoriert (im Strict Mode gibt es einen
TypeError). Ändern lässt sich der Schlüssel überaccessKey. - Barrierefreiheit:
accesskeykann mit Tastenkürzeln von Screenreadern, Browser oder Betriebssystem kollidieren. Setze es sparsam ein und dokumentiere die Kürzel sichtbar.