1 <html> 2 <head> 3 <style> 4 #d1{ 5 width:200; 6 height:400; 7 background-color:#cccccc; 8 border:2px solid black; 9 left:30; 10 top:30; 11 position:absolute; 12 } 13 #d1_head{ 14 height:30; 15 background-color:blue; 16 color:white; 17 font-size:20pt; 18 } 19 #d1_body{ 20 background-color:#cccccc; 21 } 22 </style> 23 <script> 24 function doAction(index){ 25 var obj = document.getElementById('u' + index); 26 if(obj.style.display == 'none'){ 27 obj.style.display = 'block'; 28 }else{ 29 obj.style.display = 'none'; 30 } 31 } 32 33 function test(){ 34 var obj = document.getElementById('l1'); 35 alert(obj.innerHTML); 36 } 37 </script> 38 </head> 39 <body style="font-size:20pt;"> 40 <div id="d1"> 41 <div id="d1_head">菜单</div> 42 <div id="d1_body"> 43 <ul> 44 <li> 45 <span onclick="doAction(1);">menu1</span> 46 </li> 47 <ul style="display:none;" id="u1"> 48 <li><a href="#">item1</a></li> 49 <li><a href="#">item2</a></li> 50 </ul> 51 <li> 52 <span onclick="doAction(2);">menu2</span> 53 </li> 54 <ul style="display:none;" id="u2"> 55 <li><a href="#">item1</a></li> 56 <li><a href="#">item2</a></li> 57 </ul> 58 </ul> 59 </div> 60 </div> 61 </body> 62 </html>