href

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

Hinweis: Spezifikationen vor SVG 2 definierten ein xlink:href Attribut, welches jetzt durch das href Attribut obsolet ist. Wenn Sie frühere 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 Ort des referenzierten Objekts, ausgedrückt als URL-Referenz.

Wert <url>
Standardwert Keiner
Animierbar Ja

animate, animateMotion, animateTransform, set

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

Die URL muss genau auf ein Ziel-Element verweisen, das als Ziel des gegebenen Animations-Elements geeignet ist. Wenn die URL auf mehrere Ziel-Elemente verweist, wenn das gegebene Ziel-Element nicht als Ziel des gegebenen Animations-Elements geeignet ist, oder wenn das gegebene Ziel-Element nicht Teil des aktuellen Dokuments ist, wird das Animations-Element kein Ziel-Element beeinflussen. Das Animations-Element wird jedoch in Bezug auf seine Timing-Eigenschaften normal funktionieren. Insbesondere werden TimeEvents ausgelöst und das Animations-Element kann als Synchronisationsbasis in identischer Weise verwendet werden, wie wenn die URL auf ein gültiges Ziel-Element verweist.

Wenn das href Attribut oder das veraltete xlink:href Attribut nicht angegeben ist, wird das Ziel-Element das direkte übergeordnete Element des aktuellen Animations-Elements sein. Wenn sowohl xlink:href als auch href angegeben sind, wird der Wert des letzteren Attributs verwendet.

Beachten Sie die Beschreibungen der einzelnen Animations-Elemente für Einschränkungen hinsichtlich der Elementtypen, die als Ziele bestimmter Animationstypen geeignet sind.

Außer für spezifische SVG-Regeln, die in dieser Spezifikation explizit erwähnt werden, ist die normative Definition für dieses Attribut die SMIL Animationsspezifikation. 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 erstere.

Wert <url>
Standardwert Keiner
Animierbar Ja

image

Für <image> definiert href eine URL, die auf das darzustellende 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 Muster-Gradient-Element verweist; um gültig zu sein, muss die Referenz auf ein anderes <linearGradient> oder <radialGradient> Element verweisen.

Wert <url>
Standardwert Keiner
Animierbar Ja

mpath

Für <mpath>, definiert href eine URL, die auf das <path> Element oder basic shape verweist, die 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 definiert sind, werden von diesem Element geerbt. Wenn dieses Element keine Kinder hat und das referenzierte Element (möglicherweise aufgrund seines eigenen href Attributs) hat, erbt dieses Element die Kinder des referenzierten Elements. Die Vererbung kann indirekt in beliebiger Tiefe erfolgen; wenn 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 angegeben ist. 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 Referenzen werden als Verweis auf das Wurzelelement des referenzierten Dokuments angesehen.

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

BCD tables only load in the browser

svg.elements.animate.href

BCD tables only load in the browser

svg.elements.animateMotion.href

BCD tables only load in the browser

svg.elements.animateTransform.href

BCD tables only load in the browser

svg.elements.feImage.href

BCD tables only load in the browser

svg.elements.image.href

BCD tables only load in the browser

svg.elements.linearGradient.href

BCD tables only load in the browser

svg.elements.mpath.href

BCD tables only load in the browser

svg.elements.pattern.href

BCD tables only load in the browser

svg.elements.radialGradient.href

BCD tables only load in the browser

svg.elements.script.href

BCD tables only load in the browser

svg.elements.set.href

BCD tables only load in the browser

svg.elements.textPath.href

BCD tables only load in the browser

svg.elements.use.href

BCD tables only load in the browser

Siehe auch