javascript实现列表的点击展开折叠

 1 <script>  
 2 window.onload = function() 
 3 {  
 4     //要折叠的区域
 5     var catalog = document.getElementById("div-id");
 6     //如果全部列表都添加折叠使用document.getElementsByTagName("ul");
 7     var childs  = catalog.getElementsByTagName("ul");
 8     for (var i = 0; i < childs.length; i++)
 9     {
10         var liList = childs[i].childNodes;
11         for (var j = 0; j < liList.length; j++)
12         {
13             if (liList[j].tagName == "LI")
14             {
15                 addEvent(liList[j]);
16             }
17         }
18     }
19 }  
20 function addEvent(o) 
21 {  
22     var as = o.getElementsByTagName("a");  
23     as[0].onclick = function(e)
24     {  
25         var theEvent = window.event || e;  
26         var link = theEvent.srcElement ? theEvent.srcElement : theEvent.target;  
27         var uls  = link.parentNode.childNodes;  
28         for (var i = 0;i < uls.length;i++) 
29         {  
30             if (uls[i].tagName == "UL") 
31             {  
32                 if (uls[i].style.display == "none")
33                 {  
34                     uls[i].style.display = "block";  
35                 } 
36                 else 
37                 {  
38                     uls[i].style.display = "none";  
39                 }  
40             }  
41          }  
42     }  
43 }  

以上是javascript简单的对列表实现点击展开折叠功能

转载于:https://www.cnblogs.com/helloworldhao/p/5732659.html