CSSFontFeatureValuesMap.has() — Methode · JavaScript-Referenz

Signatur

CSSFontFeatureValuesMap.prototype.has(key)

Beschreibung

Die Methode has() gehört zur Schnittstelle CSSFontFeatureValuesMap. Sie gibt einen Boolean zurück, der angibt, ob in der Map ein Eintrag mit dem angegebenen Schlüssel existiert. CSSFontFeatureValuesMap ist eine maplike-Schnittstelle und verhält sich deshalb bei Methoden wie has(), get(), set(), delete() und beim Iterieren wie eine normale JavaScript-Map.

Solche Maps bekommt man über die Eigenschaften einer CSSFontFeatureValuesRule, also einer @font-feature-values-Regel im CSSOM. Jeder Feature-Block hat eine eigene Map: annotation, ornaments, stylistic, swash, characterVariant und styleset. Die Schlüssel sind die Namen, die Autorinnen und Autoren vergeben (z. B. nice-style). Die Werte sind Arrays mit den zugehörigen Feature-Indizes.

Nützlich ist has(), wenn man zur Laufzeit wissen will, ob ein bestimmter Alias definiert ist, bevor man ihn etwa in font-variant-alternates (z. B. styleset(nice-style)) verwendet. Auch beim dynamischen Ergänzen von Werten mit set() hilft die Methode, versehentliches Überschreiben zu vermeiden.

Parameter

Name	Typ	Default	Beschreibung
$key Pflicht	string		Der Name des Feature-Werts, nach dem gesucht wird, z. B. `"nice-style"`. Andere Typen werden in einen String umgewandelt.

Beispiele

Prüfen, ob ein Styleset-Alias definiert ist

const sheet = new CSSStyleSheet();
sheet.replaceSync(`
  @font-feature-values "Font One" {
    @styleset {
      nice-style: 12;
    }
  }
`);

const rule = sheet.cssRules[0]; // CSSFontFeatureValuesRule

console.log(rule.styleset.has("nice-style"));
console.log(rule.styleset.has("fancy-style"));

true false

Jeder Feature-Block hat eine eigene Map

const sheet = new CSSStyleSheet();
sheet.replaceSync(`
  @font-feature-values "Font One" {
    @swash { fancy: 1; }
    @styleset { nice-style: 12; }
  }
`);

const rule = sheet.cssRules[0];

// 'fancy' ist nur im @swash-Block definiert
console.log(rule.swash.has("fancy"));
console.log(rule.styleset.has("fancy"));

true false

Wert nur ergänzen, wenn er noch fehlt

const findFeatureRule = (family) => {
  for (const sheet of document.styleSheets) {
    for (const rule of sheet.cssRules) {
      if (rule instanceof CSSFontFeatureValuesRule && rule.fontFamily.includes(family)) {
        return rule;
      }
    }
  }
  return null;
};

const rule = findFeatureRule("Font One");

if (rule && !rule.styleset.has("alt-digits")) {
  rule.styleset.set("alt-digits", [3]);
  console.log("Alias angelegt:", rule.styleset.get("alt-digits"));
}

Alias angelegt: [3]

// Wichtig · Fallstricke

Browser-Kompatibilität: @font-feature-values samt CSSFontFeatureValuesMap gibt es in Chromium erst ab Version 111. Der Umfang in Firefox und Safari unterscheidet sich je nach Version. Vorher mit typeof CSSFontFeatureValuesMap !== \"undefined\" oder \"CSSFontFeatureValuesRule\" in window prüfen.
Richtige Map wählen: has() durchsucht nur die Map, auf der die Methode aufgerufen wird. Ein Name aus @swash ist also über rule.styleset nicht zu finden.
Genaue Schreibweise: Die Schlüssel werden als exakte Strings verglichen. Leerzeichen oder abweichende Groß- und Kleinschreibung führen dazu, dass false zurückkommt.
has() sagt nur, ob der Alias im CSSOM definiert ist. Ob die Schrift das zugehörige OpenType-Feature tatsächlich enthält, lässt sich damit nicht prüfen.
Bei Stylesheets von fremden Domains (CORS) wirft der Zugriff auf cssRules einen SecurityError.

Siehe auch

Map.prototype.has() CSSFontFeatureValuesMap.clear() CSSFontFeatureValuesMap.get() CSSFontFeatureValuesMap.keys() CSSFontFeatureValuesMap.set()