Need help with getElementById

[Khoward]

I have code that needs to be repeated quite often and Im not sure how to do it. It would be nice if the value of "REV" could automatically associate itself with whatever Id that is the name number as REV.


heres a small portion of the code

if (REV == 01) {document.getElementById("a01").style.backgroundColor = "#00DD00";}
if (REV == 02) {document.getElementById("a02").style.backgroundColor = "#00DD00";}
if (REV == 03) {document.getElementById("a03").style.backgroundColor = "#00DD00";}
if (REV == 04) {document.getElementById("a04").style.backgroundColor = "#00DD00";}
if (REV == 05) {document.getElementById("a05").style.backgroundColor = "#00DD00";}

any help is appreicated.

[Khoward]

I should probably have been more descriptive. I am looking for a way to get the id element to be the same as the value of REV without using hundreds of lines of code that I am using now.

This code is used for changing the background colors of 100 different squares on a page. The square color changes depending on different values.

Here's My website

[mrhoo]

var who=document.getElementById("a"+REV);
if(who)who.style.backgroundColor = "#00DD00";

Note that you cannot have a literal 01 or 02- it would have to be a string '01', '02', etc.

[Khoward]

Thank you Mrhoo. it worked perfectly.

[Tcobb]

You might want to try this. If you have to cycle through document.getElementById
for each box every time you want to change their colors it can be very inefficient. The getRefs function below returns an array of all the references that you can manipulate directly. Run it once when the page loads and then it will be pretty easy to manage the elements provided you store the output in a global array.

function getRefs(str){  //str in your case would be 'REV'
   var x, current, flag, ctr, ref = Array();
   current = new String();
   flag = true;
   ctr = 1;  //since you're starting at '01' rather than zero

   while(flag){
      flag = false;
      current = ctr + ''; 
      if(current.length == 1){
         current = '0' + current;
      }
      current = str + current;
      alert(current);
      x = document.getElementById(current);
      if(x != (null || undefined)){
         ref.push(x);
         ctr++;
         flag = true;
      }
   }
return ref;
}   

window.onload=function(){
var z = getRefs('REV');
for( var i = 0; i < z.length; i++){
   z[i].style.backgroundColor = "red";
}
}

Note though that the chain must be continuous. If you have a "REV12" and a "REV14" but no "REV13" the function won't map anything after the gap.