Determine how many DIV's that follow a name standard ?

[Caffeine]

Hallu,
this is my first post on this board so be nice :)


On to the scenario:
On my webpage I will have x numbers of <DIV>'s, named
iVal1, iVal2, iVal3 and so on

Is there any way I could determine how many <DIV>'s I have that follow that name standard ?

The final goal is to make a menu, kind of. When someone clicks on a link that expands say iVal2, every other iValX-layer should close.


: Oh, I forgot to say that the script I'm making only needs to work in IE 5.x or better.

phleg

[glenngv]

maybe like this?

function expandCollapseMenu(idx){
//collapse other menu
for (var i=1;(obj=document.getElementById("iVal" + i));i++){
if (obj.id!="iVal"+idx) obj.style.display='none';
}
//your code for expanding given menu here
}

...

<div id="iVal1">div 1</div>
<div id="iVal2">div 2</div>
<div id="iVal3">div 3</div>
<div id="iVal4">div 4</div>
<input type="button" value="Expand div 2" onclick="expandCollapseMenu(2)">

[Danne]

...Or call all those divs just iVal. If you have more than one, you will have a collection;



function show(nr)
{
for(var i=0;i<iVal.length;i++)
if(nr==i)
iVal[i].style.display='block';
else
iVal[i].style.display='none';

}

</script>

<div id="iVal">Div 0</div> <!-- iVal[0] -->
<div id="iVal">Div 1</div> <!-- iVal[1] -->
<div id="iVal">Div 2</div> <!-- iVal[2] -->
<div id="iVal">Div 3</div> <!-- iVal[3] -->

<input type="button" onClick="show(2);">



Ha det!

[cheesebagpipe]

var i = 1;
while (el = document.getElementById('iVal' + (i++)) {
....do something with el

[jkd]

Originally posted by Danne
...Or call all those divs just iVal. If you have more than one, you will have a collection;

And you could invalidate the page while making it IE-only at the same time? An id must be unique. A correct browser will not form a collection for you of elements with the same id.

[Danne]

Originally posted by jkd
And you could invalidate the page while making it IE-only at the same time? An id must be unique. A correct browser will not form a collection for you of elements with the same id.

Nice to learn something new....:D

[boywonder]

I usually create a collection of divs like this upon page load (divs starting with 'iVal' as an example)
function MakeDivGroup() {
var i=0, allDivs=document.getElementsByTagName('div'), j=allDivs.length, myDivs=new Array();
while(i<j){
if(/^(iVal)/.test(allDivs[i].id)) myDivs[myDivs.length] = allDivs[i];
i++;
}
}hope that helps

[Caffeine]

Thanks for your replies,
I haven't logged on here in a while, there of my late reply.

However, I didn't have to use the function I tried to create, a kind of tree-menu.

I got it to work but there was also a login function on that page, which screwed this up. When someone is logged in, everything on the content-area is pushed down 2 rows (<BR><BR>) so the div's got placed under some other content.

My solution was to create a new page for each of the link-items in the DIVs. Not the very best solution, but it seemed to be the best one, at the time :)

-phleg-