Häufig verwendete Makros

Diese Seite listet viele der zumeist allgemein verwendeten Makros auf, die für MDN erstellt wurden. Für weitere Anleitungen zur Nutzung dieser Makros, siehe Makros verwenden.

Weitere Informationen zu Makros, die selten verwendet, nur in speziellen Kontexten genutzt oder veraltet sind, finden Sie unter Andere Makros.

Verlinkung

MDN bietet eine Anzahl von Link-Makros zur erleichterten Erstellung von Links zu Referenzseiten, Glossareinträgen und anderen Themen.

Link-Makros werden gegenüber normalen Markdown-Links empfohlen, da sie prägnant und übersetzungsfreundlich sind. Beispielsweise müssen ein Glossar oder Referenzlink, die mit einem Makro erstellt wurden, nicht übersetzt werden: In anderen Lokalisierungen wird automatisch auf die korrekte Version der Datei verlinkt.

Glossar-Verlinkungen

Das Glossary-Makro erstellt einen Link zu einem spezifischen Eintrag im Glossar von MDN. Dieses Makro akzeptiert einen erforderlichen und einen optionalen Parameter:

  1. Der Name des Begriffs (zum Beispiel "HTML"): {{Glossary("HTML")}} ergibt HTML
  2. Optional: Der anzuzeigende Text im Artikel anstelle des Begriffsnamens: {{Glossary("CSS", "Cascading Style Sheets")}} ergibt Cascading Style Sheets

Verlinkung zu Seiten in Referenzen

Es gibt Makros für lokalisierungsunabhängige Links zu Seiten in spezifischen Referenzbereichen von MDN: JavaScript, CSS, HTML-Elemente, SVG, etc.

Die Makros sind einfach zu verwenden. Im Minimum müssen Sie den Namen des Elements, zu dem Sie verlinken möchten, als erstes Argument spezifizieren. Die meisten Makros nehmen auch ein zweites Argument an, das Ihnen erlaubt, den Anzeigetext zu ändern (Dokumentation findet sich in den Links in der äußersten linken Spalte unten).

Makro Links zur Seite unter Beispiel
CSSxRef CSS Reference (/Web/CSS/Reference) {{CSSxRef("cursor")}} ergibt cursor.
DOMxRef DOM Reference (/Web/API) {{DOMxRef("Document")}} oder {{DOMxRef("document")}} ergibt [`Document`](/de/docs/Web/API/Document),
{{DOMxRef("document.getElementsByName()")}} ergibt [`document.getElementsByName()`](/de/docs/Web/API/Document/getElementsByName)
{{DOMxRef("Node")}} ergibt [`Node`](/de/docs/Web/API/Node).
Sie können den Anzeigetext mit einem zweiten Parameter ändern: {{DOMxRef("document.getElementsByName()","getElementsByName()")}} ergibt [`getElementsByName()`](/de/docs/Web/API/Document/getElementsByName).
HTMLElement HTML Elements reference (/Web/HTML/Element) {{HTMLElement("select")}} ergibt <select>
JSxRef JavaScript reference (/Web/JavaScript/Reference). {{JSxRef("Promise")}} ergibt Promise
SVGAttr SVG attribute reference (/Web/SVG/Attribute). {{SVGAttr("d")}} ergibt d
SVGElement SVG Element reference (/Web/SVG/Element). {{SVGElement("view")}} ergibt <view>
HTTPHeader HTTP headers (/Web/HTTP/Headers). {{HTTPHeader("ACCEPT")}} ergibt ACCEPT
HTTPMethod HTTP request methods (/Web/HTTP/Methods). {{HTTPMethod("HEAD")}} ergibt HEAD
HTTPStatus HTTP response status codes (/Web/HTTP/Status) {{HTTPStatus("404")}} ergibt 404

Previous, Next und PreviousNext bieten Navigationssteuerelemente für Artikel, die Teil von Sequenzen sind. Für die einseitigen Vorlagen ist nur der Wiki-Standort des vorherigen oder nächsten Artikels in der Sequenz erforderlich. Für PreviousNext sind die beiden Parameter die Wiki-Standorte der entsprechenden Artikel erforderlich. Der erste Parameter ist für den vorherigen Artikel, und der zweite ist für den nächsten Artikel.

Code-Beispiele

Live-Beispiele

Es gibt Vorlagen für fast jede große Sammlung von Seiten. Diese verlinken normalerweise zurück zur Hauptseite der Referenz/Leitfaden/Tutorial (dies ist oft notwendig, da unsere Breadcrumbs dies manchmal nicht können) und ordnen den Artikel der passenden Kategorie zu.

  • CSSRef erstellt die Sidebar für CSS-Referenzseiten.
  • HTMLSidebar erstellt die Sidebar für HTML-Referenzseiten.
  • APIRef erstellt die Sidebar für Web-API-Referenzseiten.

Allgemeine Formatierung

Inline-Indikatoren für API-Dokumentation

Optional_Inline und ReadOnlyInline werden in API-Dokumentationen verwendet, meist bei der Beschreibung von Eigenschaftenlisten eines Objekts oder Parametern einer Funktion.

Verwendung: {{Optional_Inline}} oder {{ReadOnlyInline}}. Beispiel:

isCustomObject Nur lesbar

Gibt an, ob true, dass das Objekt ein benutzerdefiniertes ist.

parameterX Optional

Blah blah blah…

Status- und Kompatibilitätsindikatoren

Inline-Indikatoren ohne zusätzliche Parameter

Nicht-standardisiert

Non-standard_Inline fügt ein Inline-Zeichen ein, das anzeigt, dass die API nicht standardisiert ist und sich nicht auf dem Weg zur Standardisierung befindet.

Syntax

{{Non-standard_Inline}}

Beispiele
  • Icon:

Experimentell

Experimental_Inline fügt ein Inline-Zeichen ein, das anzeigt, dass die API nicht weit verbreitet implementiert und möglicherweise in Zukunft verändert wird. Weitere Informationen zur Definition experimentell finden Sie in der Dokumentation Experimentell, veraltet und obsolet.

Syntax

{{Experimental_Inline}}

Beispiele
  • Icon:

Inline-Indikatoren mit Angabe der Technologie

Veraltet

Deprecated_Inline fügt ein Inline-Zeichen "veraltet" ein ( ), um von der Verwendung einer offiziell veralteten API abzuraten (oder einer, die entfernt wurde). Weitere Informationen zur Definition veraltet finden Sie in der Dokumentation Experimentell, veraltet und obsolet.

Syntax

{{Deprecated_Inline}}

Beispiele
  • Icon:

Header-Indikatoren für Seite oder Abschnitt

Diese Vorlagen haben die gleichen Semantiken wie ihre Inline-Pendants, die oben beschrieben wurden. Die Vorlagen sollten direkt unterhalb des Hauptseitentitels (oder der Breadcrumb-Navigation, falls verfügbar) auf der Referenzseite platziert werden. Sie können auch verwendet werden, um einen Abschnitt auf einer Seite zu kennzeichnen.

  • Non-standard_Header: {{Non-standard_Header}}

    Kein Standard: Diese Funktion ist nicht standardisiert und befindet sich nicht im Standardisierungsprozess. Verwenden Sie sie nicht auf Produktionsseiten, die auf das Web ausgerichtet sind: Sie wird nicht für alle Benutzer funktionieren. Außerdem kann es große Inkompatibilitäten zwischen Implementierungen geben und das Verhalten kann sich in Zukunft ändern.

  • SeeCompatTable wird auf Seiten verwendet, die experimentelle Funktionen dokumentieren. Beispiel: {{SeeCompatTable}}

    Experimentell: Dies ist eine experimentelle Technologie
    Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig, bevor Sie diese produktiv verwenden.

  • Deprecated_Header: {{Deprecated_Header}}

    Veraltet: Diese Funktion wird nicht mehr empfohlen. Obwohl einige Browser sie möglicherweise noch unterstützen, kann sie bereits aus den relevanten Webstandards entfernt worden sein, befindet sich im Prozess der Entfernung oder wird nur aus Kompatibilitätsgründen beibehalten. Vermeiden Sie die Verwendung und aktualisieren Sie gegebenenfalls bestehenden Code; siehe die Kompatibilitätstabelle am Ende dieser Seite, um Ihre Entscheidung zu treffen. Beachten Sie, dass diese Funktion jederzeit nicht mehr funktionieren kann.

  • SecureContext_Header. Sollte auf Hauptseiten wie Schnittstellenseiten, API-Übersichtsseiten und API-Einstiegspunkten (z.B. navigator.xyz) eingesetzt werden, üblicherweise jedoch nicht auf Unterseiten wie Methoden- und Eigenschaftsseiten. Beispiel: {{SecureContext_Header}}

    Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.

Anzeige, dass eine Funktion in Web-Workern verfügbar ist

Das AvailableInWorkers-Makro fügt einen lokalisierten Hinweis ein, dass eine Funktion im worker context verfügbar ist. Sie können auch Argumente übergeben, um anzuzeigen, dass eine Funktion in einem bestimmten worker context funktioniert.

Syntax
{{AvailableInWorkers}}
{{AvailableInWorkers("window_and_worker_except_service")}}
Beispiele

Hinweis: Dieses Feature ist verfügbar in Web Workers.

Hinweis: Dieses Feature ist verfügbar in Web Workers, außer in Service Workers.

Makros für Browser-Kompatibilität und Spezifikation

Die folgenden Makros sind auf allen Referenzseiten enthalten, werden aber auch von allen Seitentypen unterstützt:

{{Compat}} / {{Compat(<feature>)}} / {{Compat(<feature>, <depth>)}}

Erstellt eine Kompatibilitätstabelle für die im Parameter übergebene Funktion. Wenn kein Parameter enthalten ist, wird auf die Funktionen, die durch browser-compat im Frontmatter definiert sind, zurückgegriffen. Ein optionaler Tiefenparameter legt fest, wie tief untergeordnete Funktionen in die Tabelle aufgenommen werden sollen. Die Tiefe, falls nicht angegeben, ist standardmäßig 1, das bedeutet, dass nur das erste Level von Unterfunktionsdaten aus BCD in die Tabelle aufgenommen wird.

{{Specifications}} / {{Specifications(<feature>)}}

Enthält die Spezifikation für die in der Parameter angegeben Funktion. Wenn kein Parameter übergeben wird, wird die aufgelistete Spezifikation durch den Wert für spec-urls im Frontmatter definiert, falls vorhanden, oder aus der in den Browser-Kompatibilitätsdaten definierten Spezifikation browser-compat im Frontmatter. Die Spezifikation wird als externer Link dargestellt.

Siehe auch