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>
