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.attributeStyleMapRead only-
A
StylePropertyMaprepresenting the declarations of the element'sstyleattribute. HTMLElement.datasetRead only-
A
DOMStringMapobject 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.datasetproperty and HTML'sdata-*global attribute. SVGElement.classNameDeprecated Read only-
An
SVGAnimatedStringthat reflects the value of theclassattribute on the given element, or the empty string ifclassis not present. This attribute is deprecated and may be removed in a future version of this specification. Authors are advised to useElement.classListinstead. -
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.ownerSVGElementRead only-
An
SVGSVGElementreferring to the nearest ancestor<svg>element.nullif the given element is the outermost<svg>element. -
SVGElement.style -
A
CSSStyleDeclarationrepresenting the declarations of the element'sstyleattribute. -
SVGElement.tabIndex -
The position of the element in the tabbing order.
SVGElement.viewportElementRead only-
The
SVGElementwhich established the current viewport. Often the nearest ancestor<svg>element.nullif 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
SVGElementwhen 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