html实现树形结构(精简代码)
1
<style>
2
A{margin-left:20px;width:100px;border:1px solid gray;float:left;clear:both;cursor:hand;}
3
B{width:100px;border:1px solid gray;float:left;clear:both;cursor:default;}
4
</style>
5
<B >A</B>
6
<A >1</A><A>2</A>
7
<B >B</B>
8
<A >4</A><A >5</A><A >6</A>
9
10
<SCRIPT LANGUAGE="JavaScript">
11
var B_Tags=document.getElementsByTagName("B" );
12
for(var i=0;i<B_Tags.length;i++)
13
{
14
B_Tags[i].onclick=function (){
15
change(event.srcElement);
16
event.cancelBubble=true;
17
}
18
}
19
var c=0;
20
function change(obj)
21
{
22
var myobj=obj.nextSibling;
23
while(myobj.tagName!="B" && myobj.tagName!="SCRIPT" )
24
{
25
if(myobj.tagName!=null)
26
{
27
myobj.style.display=(myobj.style.display=="none")?"":"none";
28
}
29
myobj=myobj.nextSibling;
30
}
31
}
32
</SCRIPT>
<style>2
A{margin-left:20px;width:100px;border:1px solid gray;float:left;clear:both;cursor:hand;} 3
B{width:100px;border:1px solid gray;float:left;clear:both;cursor:default;}4
</style>5
<B >A</B>6
<A >1</A><A>2</A>7
<B >B</B>8
<A >4</A><A >5</A><A >6</A> 9
10
<SCRIPT LANGUAGE="JavaScript">11
var B_Tags=document.getElementsByTagName("B" );12
for(var i=0;i<B_Tags.length;i++)13
{14
B_Tags[i].onclick=function (){15
change(event.srcElement);16
event.cancelBubble=true;17
}18
}19
var c=0;20
function change(obj)21
{ 22
var myobj=obj.nextSibling; 23
while(myobj.tagName!="B" && myobj.tagName!="SCRIPT" )24
{ 25
if(myobj.tagName!=null)26
{ 27
myobj.style.display=(myobj.style.display=="none")?"":"none";28
} 29
myobj=myobj.nextSibling; 30
}31
}32
</SCRIPT>


A
浙公网安备 33010602011771号