How to count no of elements ?

Question

hi suppose i have

what i want is inside maindiv i want to count no of elements(may be div input tags)present. there may be use of getElementByTagName(). But the problem is that how to count element.

Thanks

Answer 1

I think you want getElementsByTagName() rather than getElementByTagName().

That function, given the appropriate parameter, will return a list of all the elements of that particular tag name (divs, p's, etc.)

On every list is a property .length, which will give you the count.

From mozilla docs:

// check the alignment on a number of cells in a table. 
var table = document.getElementById("forecast-table"); 
var cells = table.getElementsByTagName("td"); 
for (var i = 0; i < cells.length; i++) { 
    var status = cells[i].getAttribute("data-status"); 
    if ( status == "open" ) { 
        // grab the data 
    }
}

And I agree with @pranay_stacker; jQuery gives you a simpler way to get the info.

Answer 2

To continue from John's answer, you may be looking for something like this, if I understand that you want to count the div and input children within the id="maindiv" element:

var maindiv = document.getElementById('maindiv');

var count = maindiv.getElementsByTagName('div').length +
            maindiv.getElementsByTagName('input').length;