Cycle through all DIVs, please help

[Marc]

Hi to all,

I have several DIVs in a page, each has a unique name. I'd need a method to
cycle through all DIVs so that I can change their style. For example, let's
say I need to set a red background to DIVs whose name begins with "a". This
is the pseudo code:

For Each Div in The Page
If Div's name starts with 'a' then set Div's background to Red
Next

How can I translate this 'pseudocode' into real javascript code?
Thank you!

Marc

 

[Martin Honnen]

I have several DIVs in a page, each has a unique name. I'd need a method to
cycle through all DIVs so that I can change their style. For example, let's
say I need to set a red background to DIVs whose name begins with "a". This
is the pseudo code:

For Each Div in The Page
If Div's name starts with 'a' then set Div's background to Red
Next

How can I translate this 'pseudocode' into real javascript code?

<div> elements in HTML don't have a name attribute so you should use the
id attribute e.g.
<div id="a1">...</div>
You can find out all the <div> elements in the document with
var divs = document.getElementsByTagName('div');
then loop
for (var i = 0; i < divs.length; i++) {
var div = divs;
if (div.id.indexOf('a') == 0 && div.style) {
div.style.backgroundColor = 'red';
}
}

 

[Ivo]

I have several DIVs in a page, each has a unique name. I'd need a method to
cycle through all DIVs so that I can change their style. For example, let's
say I need to set a red background to DIVs whose name begins with "a". This
is the pseudo code:

For Each Div in The Page
If Div's name starts with 'a' then set Div's background to Red
Next

How can I translate this 'pseudocode' into real javascript code?
Thank you!

Marc

var els = document.getElementsByTagName('div');
var i = els.length; while( i-- ) {
if( els.indexOf('a') === 0 ) {
els.style.background = 'red';
}
}

You could use an incrementing "for" loop, but a decrementing "while" is
faster.
HTH
Ivo

 

[Ivo]

"Ivo"wrote

if( els.indexOf('a') === 0 ) {

Too fast! That should of course have been:
if( els.name.indexOf('a') === 0 ) {
if you are happy with named div's. I 'd use id's.
Ivo