/*
 * last update 2006.12.06
 * -------------------------------------------------
 * "showhide"はどのバーを表示するかを決める関数です.
 * "switchdis"は表示切替だけのための関数です.
 * tbnum:TargetBarNumber
 * tbname:TargetBarName
 * tb:TargetBar
 * cbname:ChangeBarName
 * cb:ChangeBar
 * bs:BarStatus
 * bn:BarNumber
 * s:nantonaku
 * t:nantonaku
 */

function showhide(tbnum) {
  var tbname, tb, cbname, cb, bs, bn, show, i;
  tbname = 'bar' + tbnum;
  tb = document.getElementById(tbname);
  for(i=1;i<4;i++){
    cbname = 'bar' + i;
    cb = document.getElementById(cbname);
    if(i==tbnum){
      switchdis(cbname);
    } else {
      cb.style.display = 'none';
    }
  }
}

function switchdis(t){
  var s;
  s = document.getElementById(t);
  if(s.style.display=='none'){
    s.style.display = 'block';
  } else {
    s.style.display = 'none';
  }
}

id="bar1"、id="bar2"、id="bar3"が存在する時
どれか1つだけを表示する。
id="bar*"はHTMLの方でstyle="display:none;"を初めから指定しておく。
hogehogeして.lengthで繰り返し回数変えたり。
えらい人ならできそう。
ついでにこんなに変数いらない？うまく書くとこんなに要らない気もする。

どれか1つだけを表示

JavaScript