不在大家有没有注意到，我们电脑的每个文件夹就是一个树型菜单，可以有很多下级菜单。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//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" /> <title>无标题文档</title> <style type="text/css"> li{list-style:none} </style> </head> <body> <img src="images/fold.gif" width="16" height="16" /><font style="font-weight:bold">树形菜单：</font> <!--文学艺术栏目--> <li onclick="show( )" style="margin-left:50px;margin-top:20px"><img src="images/fclose.gif" width="16" height="18" />文学艺术</li> <ul id="art" style="display:none"> <li><img src="images/doc.gif" width="35" height="20" />钢铁是怎么练成的</li> <li><img src="images/doc.gif" width="35" height="20" />人的真善美</li> <li><img src="images/doc.gif" width="35" height="20" />永远不要放弃自己</li> </ul> <!--贴吧专区--> <li onclick="show1( )" style="margin-left:50px;margin-top:20px"><img src="images/fclose.gif" width="16" height="18" />贴吧专区</li> <ul id="ar" style="display:none"> <li><img src="images/doc.gif" width="35" height="20" />真我风采</li> <li><img src="images/doc.gif" width="35" height="20" />视频贴图</li> <li><img src="images/doc.gif" width="35" height="20" />行行摄摄</li> </ul> </body> <script type="text/javascript"> <!--定义文学艺术函数--> function show( ){ if(document.getElementById("art").style.display=='block'){ document.getElementById("art").style.display='none'; } else{ document.getElementById("art").style.display='block'; } } <!--定义贴吧专区函数--> function show1( ){ if(document.getElementById("ar").style.display=='block'){ document.getElementById("ar").style.display='none'; } else{ document.getElementById("ar").style.display='block'; } } </script> </html>