FREE Web Template Download
HTML CSS JAVASCRIPT SQL PHP BOOTSTRAP JQUERY ANGULARJS TUTORIALS REFERENCES EXAMPLES Blog
 

HTML DOM length Property

Attribute Object Reference Attribute Object

Example

Get the number of attributes of a <button> element:

var x = document.getElementsByTagName("BUTTON")[0].attributes.length;

The result of x could be:

2
Try it Yourself »

More "Try it Yourself" examples below.


Definition and Usage

The length property returns the number of nodes in a NamedNodeMap object.

A Node object's attributes is an example of a NamedNodeMap object.

This property is read-only.

Tip: Use the item() method to return a node at the specified index in a NamedNodeMap object.


Browser Support

Property
length Yes Yes Yes Yes Yes

Note: In Internet Explorer 8 and earlier, the length property for attributes will return the number of all possible attributes for an element.


Syntax

namednodemap.length

Technical Details

Return Value: A Number, representing the number of attribute nodes in the nodemap
DOM Version Core Level 1

Examples

More Examples

Example

Loop through all attributes of a <button> element and output the name of each attribute:

var txt = "";
var x = document.getElementById("myBtn").attributes;

var i;
for (i = 0; i < x.length; i++) {
    txt += "Attribute name: " + x[i].name + "<br>";
}

The result of txt will be:

Attribute name: id
Attribute name: onclick
Attribute name: class
Try it Yourself »

Example

Find out how many attributes an <img> element have:

var x = document.getElementById("myImg").attributes.length;

The result of x will be:

5
Try it Yourself »

Example

Loop through all attributes of an <img> element and output each attribute's name and value:

var txt = "";
var x = document.getElementById("myImg");

var i;
for (i = 0; i < x.attributes.length; i++) {
    txt = txt + x.attributes[i].name + " = " + x.attributes[i].value + "<br>";
}
Try it Yourself »

Attribute Object Reference Attribute Object