js写的一款手风琴插件
以前写的一个小插件，刚好有空，就给整理一下。其中给document对象扩展了一个方法，就是根据class获取页面元素的集合，还有就是动态给元素注册事件。
下面是代码：
css代码
1 #main
2 {
3 width:150px;
4 float:left;
5 }
6 .title
7 {
8 background-color:Gray;
9 border:1px solid #333333;
10 height:24px;
11 text-align:center;
12 line-height:24px;
13 font-size:12px;
14 width:148px;
15 float:left;
16 cursor:pointer;
17 }
18 .item
19 {
20 text-align:center;
21 border:1px solid #333333;
22 float:left;
23 }
24 .item span
25 {
26 height:24px;
27 line-height:24px;
28 font-size:12px;
29 width:148px;
30 float:left;
31 }
html代码
1 1 <div id="main">
2 2 <div class="title">浦东人民政府</div>
3 3 <div class="item">
4 4 <span>财政局</span>
5 5 <span>审计局</span>
6 6 <span>档案局</span>
7 7 <span>商务委</span>
8 8 </div>
9 9 <div class="title">浦东人民政府</div>
10 10 <div class="item">
11 11 <span>财政局</span>
12 12 <span>审计局</span>
13 13 <span>档案局</span>
14 14 <span>商务委</span>
15 15 </div>
16 16 <div class="title">浦东人民政府</div>
17 17 <div class="item">
18 18 <span>财政局</span>
19 19 <span>审计局</span>
20 20 <span>档案局</span>
21 21 <span>商务委</span>
22 22 </div>
23 23 <div class="title">浦东人民政府</div>
24 24 <div class="item">
25 25 <span>财政局</span>
26 26 <span>审计局</span>
27 27 <span>档案局</span>
28 28 <span>商务委</span>
29 29 </div>
30 30 <div class="title">浦东人民政府</div>
31 31 <div class="item">
32 32 <span>财政局</span>
33 33 <span>审计局</span>
34 34 <span>档案局</span>
35 35 <span>商务委</span>
36 36 </div>
37 37 <div class="title">浦东人民政府</div>
38 38 <div class="item">
39 39 <span>财政局</span>
40 40 <span>审计局</span>
41 41 <span>档案局</span>
42 42 <span>商务委</span>
43 43 </div>
44 44 </div>
js代码
1 //给document对象上扩展一个获取ClassName元素集合的方法
2 document.getElementsByClassName=function(ClassName){
3 var obj=new Array();//声明一个数组，用于保存获取的class元素集合
4 var elements=document.getElementsByTagName('*');
5 var reg=new RegExp("(^|//s)"+ClassName+"(//s|$)");
6 for(var i=0;i<elements.length;i++){
7 //循环所以的元素，用正则过滤出要找的class的元素
8 if(reg.test(elements[i].className)){
9 //将获取的元素，压到数组中
10 obj.push(elements[i]);
11 }
12 }
13 return obj;
14 }
15 //toggle方法，用于点击菜单显示或者隐藏其下面的子节点
16 function toggle(objhandle,objHide){
17 for(var i=0;i<objhandle.length;i++){
18 //循环所以的父节点，给他们索引赋值
19 objhandle[i].selectedIndex=i;
20 //给所有的父节点注册onclick方法
21 objhandle[i].onclick=function(){
22 var item=objHide[this.selectedIndex];
23 //点击父节点，给相应父节点下面的子节点设置隐藏或者显示的属性
24 if(item.style.display=='block'||item.style.display==''){
25 item.style.cssText='display:none;';
26
补充：web前端 , JavaScript ,
