Häufig verwendete Makros
Diese Seite listet viele der universell einsetzbaren Makros auf, die für die Nutzung auf MDN erstellt wurden. Für zusätzliche Anleitungen zur Verwendung dieser Makros siehe Verwendung von Makros.
Informationen zu Makros, die selten verwendet, nur in speziellen Kontexten genutzt oder veraltet sind, finden Sie unter Andere Makros.
Verlinkung
MDN bietet eine Reihe von Link-Makros, um das Erstellen von Links zu Referenzseiten, Glossareinträgen und anderen Themen zu erleichtern.
Link-Makros werden gegenüber normalen Markdown-Links empfohlen, da sie prägnant und übersetzungsfreundlich sind. Zum Beispiel muss ein mit einem Makro erstellter Glossar- oder Referenzlink nicht übersetzt werden: In anderen Lokalisierungen wird er automatisch auf die korrekte Dateiversion verlinken.
Glossar-Links
Das Glossary
Makro erstellt einen Link zu einem spezifizierten Eintrag im MDN-Glossar. Dieses Makro akzeptiert einen erforderlichen und einen optionalen Parameter:
- Der Name des Begriffs (wie "HTML"):
{{Glossary("HTML")}}
ergibt HTML - Optional: Der Text, der im Artikel anstelle des Begriffsnamens angezeigt werden soll:
{{Glossary("CSS", "Cascading Style Sheets")}}
ergibt Cascading Style Sheets
Verlinkung zu Seiten in Referenzen
Es gibt Makros für die lokalisierungsunabhängige Verlinkung zu Seiten in bestimmten Referenzbereichen von MDN: JavaScript, CSS, HTML-Elemente, SVG usw.
Die Makros sind einfach zu verwenden. Im Minimalfall müssen Sie nur den Namen des Objekts, zu dem verlinkt werden soll, als erstes Argument angeben. Die meisten Makros nehmen auch ein zweites Argument an, mit dem Sie den angezeigten Text ändern können (Dokumentation finden Sie in den Links in der ganz linken Spalte unten).
Makro | Verlinkt zur Seite unter | Beispiel |
---|---|---|
CSSxRef | CSS-Referenz (/Web/CSS/Reference) | {{CSSxRef("cursor")}} ergibt cursor . |
DOMxRef | DOM-Referenz (/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 angezeigten Text mit einem zweiten Parameter ändern: {{DOMxRef("document.getElementsByName()","getElementsByName()")}} ergibt [`getElementsByName()`](/de/docs/Web/API/Document/getElementsByName). |
HTMLElement | HTML-Elemente Referenz (/Web/HTML/Element) | {{HTMLElement("select")}} ergibt <select> |
JSxRef | JavaScript-Referenz (/Web/JavaScript/Reference). | {{JSxRef("Promise")}} ergibt Promise |
SVGAttr | SVG-Attributreferenz (/Web/SVG/Attribute). | {{SVGAttr("d")}} ergibt d |
SVGElement | SVG-Element referenz (/Web/SVG/Element). | {{SVGElement("view")}} ergibt <view> |
HTTPHeader |
HTTP-Header (/Web/HTTP/Headers). | {{HTTPHeader("ACCEPT")}} ergibt ACCEPT |
HTTPMethod | HTTP-Anfragemethoden (/Web/HTTP/Methods). | {{HTTPMethod("HEAD")}} ergibt HEAD |
HTTPStatus | HTTP-Antwortstatuscodes (/Web/HTTP/Status) | {{HTTPStatus("404")}} ergibt 404 |
Navigationselemente für mehrseitige Leitfäden
Previous
, Next
und PreviousNext
bieten Navigationskontrollen für Artikel, die Teil einer Sequenz sind. Für die Einweg-Vorlagen ist nur der Wiki-Standort des vorherigen oder nächsten Artikels in der Sequenz erforderlich. Für PreviousNext
sind die beiden erforderlichen Parameter die Wiki-Standorte der entsprechenden Artikel. Der erste Parameter ist für den vorherigen Artikel und der zweite für den nächsten Artikel.
Code-Beispiele
Live-Beispiele
EmbedLiveSample
lässt Sie die Ausgabe eines Code-Beispiels auf einer Seite einbetten, wie in Live-Beispiele beschrieben.LiveSampleLink
erstellt einen Link zu einer Seite, die die Ausgabe eines Code-Beispiels auf einer Seite enthält, wie in Live-Beispiele beschrieben.EmbedGHLiveSample
ermöglicht das Einbetten von Live-Beispielen von GitHub-Seiten. Mehr Informationen finden Sie unter GitHub-Live-Beispiele.
Seitengenerierung
Es gibt Vorlagen für fast jede große Sammlung von Seiten. Sie verlinken typischerweise zurück zur Hauptseite der Referenz/Leitfaden/Anleitung (dies ist oft notwendig, weil unsere Brotkrumen dies manchmal nicht können) und ordnen den Artikel in die entsprechende Kategorie ein.
CSSRef
generiert die Seitenleiste für CSS-Referenzseiten.HTMLSidebar
generiert die Seitenleiste für HTML-Referenzseiten.APIRef
generiert die Seitenleiste für Web-API-Referenzseiten.
Allgemeine Formatierung
Inline-Indikatoren für API-Dokumentationen
Optional_Inline
und ReadOnlyInline
werden in API-Dokumentationen verwendet, üblicherweise wenn die Liste der Eigenschaften eines Objekts oder Parameter einer Funktion beschrieben werden.
Verwendung: {{Optional_Inline}}
oder {{ReadOnlyInline}}
. Beispiel:
isCustomObject
Nur lesbar-
Zeigt 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 eine Inline-Markierung ein, die angibt, dass die API nicht standardisiert und nicht in einer Standardspur ist.
Syntax
{{Non-standard_Inline}}
Beispiele
- Icon: Nicht standardisiert
Experimentell
Experimental_Inline
fügt eine Inline-Markierung ein, die angibt, dass die API nicht weit verbreitet implementiert ist und sich in Zukunft ändern könnte. Für weitere Informationen zur Definition experimentell siehe die Experimentell, veraltet und obsolete Dokumentation.
Syntax
{{Experimental_Inline}}
Beispiele
- Icon: Experimentell
Inline-Indikatoren mit Unterstützung für die Angabe der Technologie
Veraltet
Deprecated_Inline
fügt eine Inline-Markierung (
Veraltet
) ein, um von der Nutzung einer offiziell veralteten (oder entfernten) API abzuraten. Für weitere Informationen zur Definition veraltet, siehe die Experimentell, veraltet und obsolete Dokumentation.
Syntax
{{Deprecated_Inline}}
Beispiele
- Icon: Veraltet
Header-Indikatoren für Seiten oder Abschnitte
Diese Vorlagen haben dieselbe Semantik wie ihre Inline-Pendants, die oben beschrieben sind. Die Vorlagen sollten direkt unter dem Hauptseitentitel (oder der Brotkrumnavigation, falls verfügbar) in 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 Features 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
) aber normalerweise nicht auf Unterseiten wie Methoden und Eigenschaftsseiten verwendet werden. Beispiel:{{SecureContext_Header}}
Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.
Kennzeichnung, dass ein Feature in Web-Workern verfügbar ist
Das AvailableInWorkers
Makro fügt eine lokalisierte Notiz ein, die anzeigt, dass ein Feature in einem worker context verfügbar ist. Sie können auch einige Argumente übergeben, um anzugeben, dass ein Feature in einem bestimmten Worker-Kontext 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 jedoch auch von allen Seitentypen unterstützt:
{{Compat}}
/{{Compat(<feature>)}}
/{{Compat(<feature>, <depth>)}}
-
Generiert eine Kompatibilitätstabelle für das angegebene Feature im Parameter. Wenn kein Parameter enthalten ist, wird standardmäßig auf die in
browser-compat
im Frontmatter definierten Features gesetzt. Ein optionaler Tiefenparameter legt fest, wie tief Unterspezifikationen zur Tabelle hinzugefügt werden sollen. Die Tiefe, wenn weggelassen, beträgt 1, was bedeutet, dass nur die erste Ebene der Unterspezifikationsdaten aus BCD in die Tabelle aufgenommen wird. {{Specifications}}
/{{Specifications(<feature>)}}
-
Enthält die Spezifikation für das angegebene Feature im Parameter. 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 unterbrowser-compat
im Frontmatter definierten Spezifikation. Die Spezifikation wird als externer Link gerendert.