SVGAElement: username property

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The username property of the SVGAElement interface represents the username component of the SVG <a> element's href. If the URL does not have a username, this property contains an empty string, "".

This property can be set to change the username of the URL. If the URL has no host or its scheme is file:, then setting this property has no effect. Setting it also rewrites the element's href attribute as a complete, absolute URL.

The username is percent-encoded when setting but not percent-decoded when reading.

See URL.username for more information.

Value

A string.

Examples

Getting the username from an SVG link

Given the following SVG:

html

<svg viewBox="0 0 200 30" xmlns="http://www.w3.org/2000/svg">
  <a id="link" href="https://anonymous:flabada@example.com/">
    <text x="0" y="20">Example</text>
  </a>
</svg>

<pre id="log"></pre>

svg {
  width: 200px;
  height: 30px;
}
svg a text {
  fill: blue;
  text-decoration: underline;
}
#log {
  padding: 0.5rem;
  border: 1px solid black;
}

const logElement = document.querySelector("#log");
function log(text) {
  logElement.innerText = `${logElement.innerText}${text}\n`;
}

We can read the username of the link:

const link = document.getElementById("link");

log(`username: "${link.username}"`); // username: "anonymous"

Specifications

Specification
Scalable Vector Graphics (SVG) 2 # InterfaceSVGAElement

Browser compatibility

Help improve MDN

Learn how to contribute

This page was last modified on Sep 11, 2026 by MDN contributors.

View this page on GitHub • Report a problem with this content