Back to Content

SVGElement

files/en-us/web/api/svgelement/index.md

latest4.1 KB
Original Source

{{APIRef("SVG")}}

All of the SVG DOM interfaces that correspond directly to elements in the SVG language derive from the SVGElement interface.

{{InheritanceDiagram}}

Instance properties

Also inherits properties from the {{DOMxRef("Element")}} interface.

  • {{DOMxRef("SVGElement.attributeStyleMap")}} {{ReadOnlyInline}}
    • : A {{DOMxRef("StylePropertyMap")}} representing the declarations of the element's {{SVGAttr("style")}} attribute.
  • {{DOMxRef("SVGElement.autofocus")}}
    • : Whether the control should be focused when the page loads, or when a {{htmlelement("dialog")}} or popover become shown.
  • {{DOMxRef("SVGElement.className")}} {{Deprecated_Inline}} {{ReadOnlyInline}}
    • : An {{DOMxRef("SVGAnimatedString")}} that reflects the value of the {{SVGAttr("class")}} attribute on the given element, or the empty string if class is not present. This attribute is deprecated and may be removed in a future version of this specification. Authors are advised to use {{DOMxRef("Element.classList")}} instead.
  • {{DOMxRef("SVGElement.dataset")}} {{ReadOnlyInline}}
    • : A {{DOMxRef("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 form {{SVGAttr("data-*")}}, where * is the key name for the pair. This works just like HTML's {{DOMxRef("HTMLElement.dataset")}} property and HTML's data-* global attribute.
  • {{DOMxRef("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.
  • {{DOMxRef("SVGElement.ownerSVGElement")}} {{ReadOnlyInline}}
    • : An {{DOMxRef("SVGSVGElement")}} referring to the nearest ancestor {{SVGElement("svg")}} element. null if the given element is the outermost <svg> element.
  • {{DOMxRef("SVGElement.style")}}
    • : A {{DOMxRef("CSSStyleDeclaration")}} representing the declarations of the element's {{SVGAttr("style")}} attribute.
  • {{DOMxRef("SVGElement.tabIndex")}}
    • : The position of the element in the tabbing order.
  • {{DOMxRef("SVGElement.viewportElement")}} {{ReadOnlyInline}}
    • : The SVGElement which established the current viewport. Often the nearest ancestor {{SVGElement("svg")}} element. null if the given element is the outermost <svg> element.

Instance methods

This interface also inherits methods from {{DOMxRef("Element")}}.

  • {{DOMxRef("SVGElement.blur()")}}
    • : Removes keyboard focus from the currently focused element.
  • {{DOMxRef("SVGElement.focus()")}}
    • : Makes the element the current keyboard focus.

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

{{Specifications}}

Browser compatibility

{{Compat}}

See also