Web/API/Element/attributes

From Get docs

The Element.attributes property returns a live collection of all attribute nodes registered to the specified node. It is a NamedNodeMap, not an Array, so it has no Array methods and the Attr nodes' indexes may differ among browsers. To be more specific, attributes is a key/value pair of strings that represents any information regarding that attribute.

Syntax

var attr = element.attributes;

Example

Basic examples

// Get the first <p> element in the document
var para = document.getElementsByTagName("p")[0];
var atts = para.attributes;

Enumerating elements attributes

Numerical indexing is useful for going through all of an element's attributes. The following example runs through the attribute nodes for the element in the document with id "paragraph", and prints each attribute's value.

<!DOCTYPE html>

<html>

 <head>
  <title>Attributes example</title>
  <script type="text/javascript">
   function listAttributes() {
     var paragraph = document.getElementById("paragraph");
     var result = document.getElementById("result");

     // First, let's verify that the paragraph has some attributes    
     if (paragraph.hasAttributes()) {
       var attrs = paragraph.attributes;
       var output = "";
       for(var i = attrs.length - 1; i >= 0; i--) {
         output += attrs[i].name + "->" + attrs[i].value;
       }
       result.value = output;
     } else {
       result.value = "No attributes to show";
     }
   }
  </script>
 </head>

<body>
 <p id="paragraph" style="color: green;">Sample Paragraph</p>
 <form action="">
  <p>
    <input type="button" value="Show first attribute name and value"
      onclick="listAttributes();">
    <input id="result" type="text" value="">
  </p>
 </form>
</body>
</html>

Specifications

Specification Status Comment
DOMThe definition of 'Element.attributes' in that specification. Living Standard From Document Object Model (DOM) Level 3 Core Specification, moved from Node to Element
Document Object Model (DOM) Level 3 Core SpecificationThe definition of 'Element.attributes' in that specification. Obsolete No change from Document Object Model (DOM) Level 2 Core Specification
Document Object Model (DOM) Level 2 Core SpecificationThe definition of 'Element.attributes' in that specification. Obsolete No change from Document Object Model (DOM) Level 1 Specification
Document Object Model (DOM) Level 1 SpecificationThe definition of 'Element.attributes' in that specification. Obsolete Initial definition.

Browser compatibility

Update compatibility data on GitHub

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
attributes Chrome

Full support 26

Edge

Full support 12

Firefox

Full support 22

IE

Full support 5.5

Opera

Full support 8

Safari

Full support 6

WebView Android

Full support ≤37

Chrome Android

Full support 26

Firefox Android

Full support 22

Opera Android

Full support 10.1

Safari iOS

Full support 6

Samsung Internet Android

Full support 1.5

Legend

Full support  
Full support


See also