一段比较实用的JS导航条显隐例子

<! DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html xmlns ="http://www.w3.org/1999/xhtml" >
< head >
< meta http-equiv ="Content-Type" content ="text/html;charset=utf-8" />
< script language ="javascript" > ...
functionfn(num)...{
vari;
for(i=1;i<=5;i++)...{
vardivtar=document.getElementById("div"+i);
varbuttontar=document.getElementById("button"+i);
if(num==i)...{
divtar.style.display="";
}else...{
divtar.style.display="none";
}
}
}
</ script >
< title > 无标题文档 </ title >
</ head >

< body >
< p > &nbsp; </ p >
< p > &nbsp; </ p >
< div id ="div1" > div1 </ div >
< div id ="div2" style ="display:none" > div2 </ div >
< div id ="div3" style ="display:none" > div3 </ div >
< div id ="div4" style ="display:none" > div4 </ div >
< div id ="div5" style ="display:none" > div5 </ div >
< p >
< input type ="submit" name ="button" id ="button1" value ="button1" onclick ="fn(1)" />
</ p >
< p >
< input type ="submit" name ="button2" id ="button2" value ="button2" onclick ="fn(2)" />
</ p >
< p >
< input type ="submit" name ="button3" id ="button3" value ="button3" onclick ="fn(3)" />
</ p >
< p >
< input type ="submit" name ="button4" id ="button4" value ="button4" onclick ="fn(4)" />
</ p >
< p >
< input type ="submit" name ="button5" id ="button5" value ="button5" onclick ="fn(5)" />
</ p >
</ body >
</ html >