Element: getAttribute() method

The getAttribute() method of the Element interface returns the value of a specified attribute on the element.

If the given attribute does not exist, the value returned will be null.

If you need to inspect the Attr node's properties, you can use the getAttributeNode() method instead.

Syntax

getAttribute(attributeName)

Parameters

attributeName

The name of the attribute whose value you want to get.

Return value

A string containing the value of attributeName if the attribute exists, otherwise null.

Examples

<!-- example div in an HTML DOC -->
<div id="div1">Hi Champ!</div>

const div1 = document.getElementById("div1");
// <div id="div1">Hi Champ!</div>

const exampleAttr = div1.getAttribute("id");
// "div1"

const align = div1.getAttribute("align");
// null

Description

Lower casing

When called on an HTML element in a DOM flagged as an HTML document, getAttribute() lower-cases its argument before proceeding.

Retrieving nonce values

For security reasons, CSP nonces from non-script sources, such as CSS selectors, and .getAttribute("nonce") calls are hidden.

let nonce = script.getAttribute("nonce");
// returns empty string

Instead of retrieving the nonce from the content attribute, use the nonce property:

let nonce = script.nonce;

Specifications

Browser compatibility

See also

• Element.hasAttribute()
• Element.setAttribute()
• Element.removeAttribute()
• Element.toggleAttribute()