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:
- Der Name des Begriffs (zum Beispiel "HTML"):
{{Glossary("HTML")}}
ergibt HTML - 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
|
Navigation für mehrseitige Leitfäden
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
EmbedLiveSample
ermöglicht es, die Ausgabe eines Code-Beispiels auf einer Seite einzubetten, wie unter Live-Beispiele beschrieben.LiveSampleLink
erstellt einen Link zu einer Seite mit der Ausgabe eines Code-Beispiels, wie unter Live-Beispiele beschrieben.EmbedGHLiveSample
ermöglicht das Einbetten von Live-Beispielen von GitHub-Seiten. Weitere Informationen finden Sie unter GitHub live samples.
Sidebar-Erstellung
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
Schreibgeschützt-
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: Nicht standardisiert
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: Experimentell
Inline-Indikatoren mit Angabe der Technologie
Veraltet
Deprecated_Inline
fügt ein Inline-Zeichen "veraltet" ein (
Veraltet
), 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: Veraltet
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}}
Nicht standardisiert: Diese Funktion ist nicht standardisiert und befindet sich nicht auf dem Weg zur Standardisierung. Verwenden Sie sie nicht auf Produktionsseiten, die dem Web ausgesetzt sind: Sie funktioniert nicht für alle Benutzer. Es kann auch 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 vor der Verwendung auf produktiven Webseiten.Deprecated_Header
:{{Deprecated_Header}}
Veraltet: Diese Funktion wird nicht mehr empfohlen. Obwohl einige Browser sie möglicherweise noch unterstützen, könnte sie bereits aus den relevanten Webstandards entfernt worden sein, in Kürze entfernt werden oder nur noch aus Kompatibilitätsgründen bestehen. Vermeiden Sie die Verwendung und aktualisieren Sie vorhandenen Code, falls möglich; siehe die Kompatibilitätstabelle am Ende dieser Seite, um Ihre Entscheidung zu unterstützen. Beachten Sie, dass diese Funktion jederzeit aufhören könnte zu funktionieren.
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: Diese Funktion ist in Web Workers verfügbar.
Hinweis: Diese Funktion ist in Web Workers verfügbar, mit Ausnahme von 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 Spezifikationbrowser-compat
im Frontmatter. Die Spezifikation wird als externer Link dargestellt.