W3cubDocs

/Web APIs

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 either be null or "" (the empty string); see Non-existing attributes for details.

Syntax

js

getAttribute(attributeName)

Parameters

  • attributeName is the name of the attribute whose value you want to get.

Return value

A string containing the value of attributeName.

Examples

html

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

js

// in a console
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.

Non-existing attributes

All modern web browsers return null when the specified attribute does not exist on the specified element.

Retrieving nonce values

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

js

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

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

js

let nonce = script.nonce;

Specifications

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
getAttribute 1 12 1 5 8 1 4.4 18 4 10.1 1 1.0

© 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/Element/getAttribute