求一个JAVASCRIPT树

求一个JAVASCRIPT树

解决方案 »

  1.   

    extjs里有树形
    jquery有tree插件
    网上其它地方也有单独的树形控件
      

  2.   

    <body onload="treeload()"> <script language="javascript" type="text/javascript"> var tid=0;
    var tname=1;
    var url=2;
    var type=3;
    var fid=4;function hidden(B){
    var nodes=loadlist();
    var T='F'+nodes[B][tid];
    var types=nodes[B][type];
    if(types.indexOf( "folder")>-1){
    document.getElementById(B).innerHTML=document.getElementById(B).innerHTML=="-"?"+":"-";
    document.getElementById(T).style.display=document.getElementById(T).style.display=="none"?"block":"none";}}function loadlist() {   
                    var nodes = new Array();   
                    var index = 0;   
                       
                
                       
                    nodes[0] = ["T1", "体育", "#", "folder", "T0"];   
    nodes[1] = ["T2", "篮球", "#", "folder", "T1"];
    nodes[2] = ["T3", "足球", "#", "folder", "T1"];
    nodes[3] = ["T14", "姚明", "#", "link", "T2"];
    nodes[4] = ["T5", "动漫", "#", "folder", "T0"];
        nodes[5] = ["T6", "天空之城", "#", "link", "T5"];
        nodes[6] = ["T7", "游戏", "#", "folder", "T0"];
        nodes[7] = ["T8", "网页游戏", "#", "folder", "T7"];
                    nodes[8] = ["T9", "单机游戏", "#", "folder", "T7"];  
    nodes[9] = ["T10", "热血三国", "#", "link", "T8"];
                    nodes[10] = ["T11", "恐龙快打", "#", "link", "T9"];  
    nodes[11] = ["T12", "拳皇", "#", "link", "T9"];
                    nodes[12] = ["T13", "大力水手", "#", "link", "T5"];  
    nodes[13] = ["T4", "星际2", "#", "link", "T9"];  
    nodes[14] = ["T15", "小贝", "#", "link", "T3"];  
                   
    return nodes;   
    }   function treeload(){
    var nodes=loadlist();for(var i=0;i<nodes.length;i++){
    var div=document.createElement("DIV");
    var divid='W'+nodes[i][tid];
    var fatherid='F'+nodes[i][fid];
    var nodeid=nodes[i][tid];
    div.id=divid;
    div.style.background="yellow";
    document.getElementById(fatherid).appendChild(div);var span=document.createElement("span");
    var spanid=i;
    span.id=spanid;
    span.onclick = function(){ 
       hidden(this.id); 
    };var ttt=nodes[i][type];
    if(ttt.indexOf( "folder")>-1){
    span.innerHTML='+'; 
    }else{
    span.innerHTML='>'; 
    }document.getElementById(divid).appendChild(span);var a=document.createElement("a");
    a.id='A'+nodes[i][tid];
    a.href=nodes[i][url];
    a.innerHTML=nodes[i][tname]; 
    document.getElementById(divid).appendChild(a);
    var divt=document.createElement("DIV");
    divt.id='F'+nodes[i][tid];
    divt.style.display="none";
    divt.style.paddingLeft='20px';
    document.getElementById(divid).appendChild(divt);}}
    </script>
    <div id="FT0"></div>

     </BODY>