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
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
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
NamedNodeMap
, the interface of the returned object- Cross-browser compatibility considerations: on quirksmode
Element.attributes by Mozilla Contributors is licensed under CC-BY-SA 2.5.