Count Number Of Div's By A Class Name

sonesay

Jan 4 2008, 12:51 AM

I have a situation where I need to be able to count the number of div elements in a page and then use that number for a loop.

I've already tried this but it returns all child div elements.

CODE

ocument.getElementById("char_list").getElementsByTagName("div").length;

I need only the child nodes directly below the parent div 'char_list'.

THe structure is like this

CODE

<div id='char_list'>
<div class='char_node'></div>
<div class='char_node'></div>
<div class='char_node'></div>
</div>

The problem here is I also have nested div's inside the 'char_node' divs so the first code returns them all. I'm trying to just gather the char_node class divs and use it in my loop/function.

truefusion

Jan 4 2008, 02:28 AM

CODE

I put this together, i believe it'll get you what you want. Try it out and see if it is sufficient.

sonesay

Jan 4 2008, 03:04 AM

CODE

function countElementsByClass(className, elementTag){
var count = new Array();
var elements = document.getElementsByTagName(elementTag);
for (var i = 0; i < elements.length; i++){
if (elements[i].className == className){
count[i] = "";
alert('found one!');
}
}
return count.length;
}

count = setTimeout("countElementsByClass('char_node', 'div');", 5000); 
setTimeout('alert(count);',10000); 

Thanks for that code Truefusion, I'm not sure what exactly is happening but I always seem to get a return of 5 on 'count', I change the two paramters being passed to that function but it still returns 5 which is weird because I put in an alert in that loop and it does alert the correct number of tagElement + className combination.

I'm sure this code will come in handy but I think I need to rethink a new approach to my problem, I've got a tab contents style section I am trying to build for each character profile. The problem is the tab contents example I got off dynamic drive http://www.dynamicdrive.com/dynamicindex17/tabcontent.htm is only for a single collection of tabs. I need to modify it to work for multiple number of character profiles. I guess this is kinda going off topic but thats the reason I wanted to get the divs with the certain class names. I think I should post another topic on it to futher explain my problem and hopefully get some more assistance on how to go about doing it.

gogoily

Jan 12 2008, 03:46 AM

Try this one:

CODE

var count = 0;
var o = document.getElementById("char_list").getElementsByTagName("div");
for(var i=0;i<o.length;i+){
if(o[i].className == "char_node")
count ++;
}
alert(count);//You get your Div number here;)

ADD REPLY / Got an Opinion!	a humble request :-)	RAPID SEARCH!	Free Hosting	[X]
Express your Opinions, Thoughts or Contribute your information that might help someone here. Ask your Doubts & Queries to get answers.. "Together, We enlight each other!"	Register FREE for AD-FREE forum, Create your own topics, Ask Questions, track topics, setup subscriptions & notifications and Get a Free Website w/ Email and FTP.		500MB Space No Ads, CPanel, FTP, PHP, MySQL, EMails - 100% FREE