How to implement JavaScript drop-down list menu _javascript tips

Previously written in this "JavaScript drop-down list to display the implementation of the tree menu" menu embodiment, but after writing it found, not very suitable, highly accurate control, and is not very good-looking. Now using table to encapsulate, we know that after each row of the table is full, the next line will be automatically added, which is much better than the previous set of our own height.
1, after the click can coexist the situation (just the function of writing is not the same as can)
Dispaly is also set itself, through the parent node to operate the child nodes, display or not;

/* Function Open1 (node) { 
   
   //through the parent node to operate the sibling node after 
    
   the click appears, directly can open but request at the point of a time, the rest of the switch off 
 
    var nodes = Node.parentnode; 
    var nn = nodes.getelementsbytagname ("ul") [0]; 
    With (Nn.style) { 
     display = (display = = "block")? ' None ': ' Block '; 
    } 
   } * * 
   </script> 

2, after the click Only allowed to open one, the rest will be turned off

 <script type= "Text/javascript" > Function list1 (node) {//This is to be done for all, must get all the right 
    Like (obtained according to the ID of the table)//According to this judgment, not belong to this, then close//alert ("AA"); 1, get click on the value of the object var nodes = node.parentnode;//Pass in the current parent node var nn = nodes.getelementsbytagname ("ul") [0];//get the current object, if traversing the 
    There is, like this object, set the opposite case, the rest of all closed//2, get all the objects var mm = document.getElementById ("MenuID"); 
     
    var names = Mm.getelementsbytagname ("ul"); 3, start pairing for (var x = 0; x < names.length x + +) {//+ + +) {/* This can be simplified by using the following method if (names[x] = nn) {i 
      F (nn.classname = = "Open2") {nn.classname = "close2"; 
      else {nn.classname = "open2"; 
     }}else {nn.classname = "close2"; 
     }*/if (names[x]==nn&&names[x].classname!= "Open2") {nn.classname= "Open2"; 
     }else{names[x].classname= "Close2"; {}}} </script> 

the writing of CSS styles:

<style type= "Text/css" > 
  ul{ 
   list-style:none; 
   margin:0px; 
   padding:0px; 
  } 
  table{ 
   border: #00ff40 solid 1px; 
  } 
  Table a{ 
   text-decoration:none; 
  } 
  Table TR TD ul{ 
   Display:none; 
  open2{ 
   Display:block; 
   Background: #8080ff; 
  close2{ 
   display:none; 
  } 

Effect chart (only one):

Complete code:

<! 
  DOCTYPE html>  

I believe that through the introduction of these two articles should have a general idea, small series of this article some of the effect of making slightly simple, we can further improve.