href

Das href Attribut definiert einen Link zu einer Ressource als Referenz URL. Die genaue Bedeutung dieses Links hängt vom Kontext des Elements ab, das ihn verwendet.

Hinweis: Spezifikationen vor SVG 2 definierten ein xlink:href Attribut, das jetzt durch das href Attribut obsolet geworden ist. Wenn Sie ältere Browserversionen unterstützen müssen, kann das veraltete xlink:href Attribut zusätzlich zum href Attribut als Fallback verwendet werden, z.B. <use href="some-id" xlink:href="some-id" x="5" y="5" />.

Sie können dieses Attribut mit den folgenden SVG-Elementen verwenden:

Beispiel

html
<svg viewBox="0 0 160 40" xmlns="http://www.w3.org/2000/svg">
  <a href="https://developer.mozilla.org/">
    <text x="10" y="25">MDN Web Docs</text>
  </a>
</svg>

In SVG

a

Für <a> definiert href den Speicherort des referenzierten Objekts, ausgedrückt als URL-Referenz.

Wert <url>
Standardwert Keiner
Animierbar Ja

animate, animateMotion, animateTransform, set

Für die <animate>, <animateMotion>, <animateTransform> und <set>, definiert href eine URL, die auf das Element verweist, das das Ziel dieses Animationselements ist und daher im Laufe der Zeit modifiziert wird.

Die URL muss auf genau ein Zielelement verweisen, das als Ziel des gegebenen Animationselements geeignet ist. Wenn die URL auf mehrere Zielelemente verweist, wenn das gegebene Zielelement nicht als Ziel des gegebenen Animationselements geeignet ist oder wenn das Ziel nicht Teil des aktuellen Dokuments ist, hat das Animationselement keine Auswirkungen auf ein Ziel. Das Animationselement arbeitet jedoch weiterhin normal in Bezug auf seine Timing-Eigenschaften. Insbesondere werden TimeEvents versendet und das Animationselement kann als Syncbase auf die gleiche Weise verwendet werden, als ob die URL auf ein gültiges Zielelement verweist.

Wenn das href Attribut oder das veraltete xlink:href Attribut nicht angegeben ist, dann wird das Zielelement das unmittelbare Elternelement des aktuellen Animationselements sein. Wenn sowohl xlink:href als auch href spezifiziert sind, wird der Wert des letzteren Attributs verwendet.

Beziehen Sie sich auf die Beschreibungen der einzelnen Animationselemente für alle Einschränkungen, welche Elementtypen Ziele bestimmter Animationstypen sein können.

Abgesehen von allen explizit in dieser Spezifikation erwähnten SVG-spezifischen Regeln, ist die normative Definition für dieses Attribut die SMIL Animation Spezifikation. Insbesondere siehe SMIL Animation: Specifying the animation target.

Wert <url>
Standardwert Keiner
Animierbar Nein

feImage

Für <feImage> definiert href eine URL, die auf eine Bildressource oder ein Element verweist. Wenn sowohl das xlink:href als auch das href Attribut angegeben sind, überschreibt das letztere das erste.

Wert <url>
Standardwert Keiner
Animierbar Ja

discard

Für <discard>, definiert href eine URL, die auf ein Element verweist, das verworfen (aus dem DOM entfernt) wird. Wenn nicht angegeben, wird das unmittelbare Elternelement von <discard> verworfen.

Wert <url>
Standardwert Keiner
Animierbar Nein

image

Für <image> definiert href eine URL, die auf das zu rendernde Bild verweist.

Wert <url>
Standardwert Keiner
Animierbar Ja
html
<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
  <image href="fxlogo.png" x="0" y="0" height="100" width="100" />
</svg>

linearGradient/radialGradient

Für <linearGradient> oder <radialGradient>, definiert href eine URL, die auf ein Vorlage-Gradienten-Element verweist; um gültig zu sein, muss der Verweis auf ein anderes <linearGradient> oder <radialGradient> Element weisen.

Wert <url>
Standardwert Keiner
Animierbar Ja

mpath

Für <mpath>, definiert href eine URL, die auf das <path> Element oder basic shape verweist, welches den Bewegungspfad definiert.

Wert <url>
Standardwert Keiner
Animierbar Nein

pattern

Für <pattern>, definiert href eine URL, die auf ein anderes <pattern> Element innerhalb des aktuellen SVG-Dokuments verweist. Alle Attribute, die auf dem referenzierten Element definiert sind und nicht auf diesem Element, werden von diesem Element geerbt. Wenn dieses Element keine Kinder hat und das referenzierte Element schon (möglicherweise aufgrund seines eigenen href Attributs), dann erbt dieses Element die Kinder vom referenzierten Element. Die Vererbung kann indirekt bis zu einem beliebigen Niveau erfolgen; wenn also das referenzierte Element Attribute oder Kinder aufgrund seines eigenen href Attributs erbt, kann das aktuelle Element diese Attribute oder Kinder ebenfalls erben. Auf dem <pattern> Element ist das href Attribut animierbar.

Wert <url>
Standardwert Keiner
Animierbar Ja

script

Für <script>, definiert href eine URL, die auf eine externe Ressource verweist, die den Skriptcode enthält.

Wert <url>
Standardwert Keiner
Animierbar Nein

textPath

Für <textPath>, definiert href eine URL, die auf das <path> Element oder basic shape verweist, auf das der Text gerendert wird, wenn kein path Attribut bereitgestellt wird. Auf dem <textPath> Element ist das href Attribut animierbar.

Wert <url>
Standardwert Keiner
Animierbar Ja

use

Für <use>, definiert href eine URL, die auf ein Element oder Fragment innerhalb eines SVG-Dokuments verweist, das geklont werden soll.

Das <use> Element kann auf ein gesamtes SVG-Dokument verweisen, indem ein href Wert ohne Fragment angegeben wird. Solche Verweise beziehen sich auf das Wurzelelement des referenzierten Dokuments.

Wert <url>
Standardwert Keiner
Animierbar Ja

Spezifikationen

Specification
Scalable Vector Graphics (SVG) 2
# AElementHrefAttribute
SVG Animations Level 2
# HrefAttribute
Filter Effects Module Level 1
# element-attrdef-feimage-href
Scalable Vector Graphics (SVG) 2
# ImageElementHrefAttribute
Scalable Vector Graphics (SVG) 2
# LinearGradientElementHrefAttribute
SVG Animations Level 2
# MPathElementHrefAttribute
Scalable Vector Graphics (SVG) 2
# PatternElementHrefAttribute
Scalable Vector Graphics (SVG) 2
# RadialGradientElementHrefAttribute
Scalable Vector Graphics (SVG) 2
# ScriptElementHrefAttribute
Scalable Vector Graphics (SVG) 2
# TextPathElementHrefAttribute
Scalable Vector Graphics (SVG) 2
# UseElementHrefAttribute

Browser-Kompatibilität

svg.elements.a.href

svg.elements.animate.href

svg.elements.animateMotion.href

svg.elements.animateTransform.href

svg.elements.feImage.href

svg.elements.image.href

svg.elements.linearGradient.href

svg.elements.mpath.href

svg.elements.pattern.href

svg.elements.radialGradient.href

svg.elements.script.href

svg.elements.set.href

svg.elements.textPath.href

svg.elements.use.href

Siehe auch