All of the SVG DOM interfaces that correspond directly to elements in the SVG language derive from the SVGElement
interface.
On this page
SVGElement
Instance properties
Also inherits properties from: DocumentAndElementEventHandlers
, Element
, SVGElementInstance
.
SVGElement.attributeStyleMap
Read only-
A
StylePropertyMap
representing the declarations of the element'sstyle
attribute. HTMLElement.dataset
Read only-
A
DOMStringMap
object which provides a list of key/value pairs of named data attributes which correspond to custom data attributes attached to the element. These can also be defined in SVG using attributes of the formdata-*
, where*
is the key name for the pair. This works just like HTML'sHTMLElement.dataset
property and HTML'sdata-*
global attribute. SVGElement.className
Deprecated Read only-
An
SVGAnimatedString
that reflects the value of theclass
attribute on the given element, or the empty string ifclass
is not present. This attribute is deprecated and may be removed in a future version of this specification. Authors are advised to useElement.classList
instead. -
SVGElement.nonce
-
Returns the cryptographic number used once that is used by Content Security Policy to determine whether a given fetch will be allowed to proceed.
SVGElement.ownerSVGElement
Read only-
An
SVGSVGElement
referring to the nearest ancestor<svg>
element.null
if the given element is the outermost<svg>
element. -
SVGElement.style
-
A
CSSStyleDeclaration
representing the declarations of the element'sstyle
attribute. -
SVGElement.tabIndex
-
The position of the element in the tabbing order.
SVGElement.viewportElement
Read only-
The
SVGElement
which established the current viewport. Often the nearest ancestor<svg>
element.null
if the given element is the outermost<svg>
element.
Instance methods
This interface has no methods, but inherits methods from: DocumentAndElementEventHandlers
, Element
, SVGElementInstance
.
Events
Listen to these events using addEventListener()
or by assigning an event listener to the equivalent on...
handler property.
-
abort
-
Fired when page loading is stopped before an SVG element has been allowed to load completely.
-
error
-
Fired when an SVG element does not load properly or when an error occurs during script execution.
-
load
-
Fires on an
SVGElement
when it is loaded in the browser. -
resize
-
Fired when an SVG document is being resized.
-
scroll
-
Fired when an SVG document view is being shifted along the X and/or Y axes.
-
unload
-
Fired when the DOM implementation removes an SVG document from a window or frame.
Specifications
Specification |
---|
Scalable Vector Graphics (SVG) 2 # InterfaceSVGElement |
Browser compatibility
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
SVGElement |
1 | 12 | 1.5 | 9 | ≤12.1 | 3 | ≤37 | 18 | 4 | ≤12.1 | 1 | 1.0 |
attributeStyleMap |
66 | 79 | No | No | 53 | 16.4 | 66 | 66 | No | 47 | 16.4 | 9.0 |
autofocus |
79 | 79 | 110
78Only supported onSVGGraphicsElement .
|
No | 66 | 15.4 | 79 | 79 | 110
79Only supported onSVGGraphicsElement .
|
57 | 15.4 | 12.0 |
blur |
1 | 17 | 51 | No | 15 | 3 | ≤37 | 18 | 51 | 14 | 1 | 1.0 |
className |
1 | 12 | 1.5 | 9 | ≤12.1 | ≤4 | 3 | 18 | 4 | ≤12.1 | 1 | 1.0 |
dataset |
55 | 17 | 51 | No | 41 | 5.1 | 55 | 55 | 51 | 41 | 5 | 6.0 |
error_event |
10 | 12 | 1.5 | 9 | ≤12.1 | 6 | ≤37 | 18 | 4 | ≤12.1 | 6 | 1.0 |
focus |
1 | 17 | 51 | No | 15 | 3 | ≤37 | 18 | 51 | 14 | 1 | 1.0 |
load_event |
1 | 12 | 9 | ≤12.1 | 3 | ≤37 | 18 | ≤12.1 | 1 | 1.0 | ||
nonce |
61 | 79 | 75 | No | 48 | 15.4 | 61 | 61 | 79 | 45 | 15.4 | 8.0 |
ownerSVGElement |
1 | 12 | 1.5 | 9 | ≤12.1 | 3 | 3 | 18 | 4 | ≤12.1 | 1 | 1.0 |
style |
1 | 12 | 1.5 | 9 | ≤12.1 | 3 | 4.4 | 18 | 4 | ≤12.1 | 1 | 1.0 |
tabIndex |
36 | 17 | 51 | No | 23 | 8 | 37 | 36 | 51 | 24 | 8 | 3.0 |
viewportElement |
1 | 12 | 1.5 | 9 | ≤12.1 | 3 | 3 | 18 | 4 | ≤12.1 | 1 | 1.0 |
See also
- HTML
data-*
attribute - SVG
data-*
attribute - Using custom data attributes in HTML
© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/SVGElement