日期:2014-05-18  浏览次数:20423 次

找个js高手帮我优化一下js树,顺便学习一下如何用js写东西,本人写的很菜
HTML code

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>无标题页</title>
    <style>
    
    .tdstyle1
    {
     height:20px;padding-left:15px;font-weight:bold;color:#586CA9;font-size:14px;border-left:solid 1px white;width:200px;    
    filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=1, StartColorStr=#FFFFFF, EndColorStr=#CFD6FF);  
    }
  </style>
</head>
<body>   
<form runat="server" id="form1">
<script type="text/javascript">
function $(id) {return document.getElementById(id)}
var html='';
//自动加载
window.onload = initMenu;
//初始化菜单
function initMenu()
{
  var rootn = document.all.menuXML.documentElement;
  var sd = 1;
  document.onselectstart = function(){return false;}
  html='<table cellpadding="0" cellspacing="0">'
  createMenu(rootn,sd)  
  $("divMenu").innerHTML += html+'</table>';  
}

function createMenu(thisn,sd)
{                       
    for(var i = 0; i < thisn.childNodes.length; i++)
    {
        var xmlNode = thisn.childNodes[i];                          
        sd = findParent(xmlNode);          
        var parenttd = "td"+sd+i+Math.random();
        var childtd = "Menu"+sd+i+Math.random();
        if(sd == 1)
        {            
            if(!xmlNode.hasChildNodes) 
                html += '<tr><td id="'+parenttd+'" class="tdstyle1">'+xmlNode.getAttribute("Name")+'</td></tr>'; 
            else
                html += '<tr><td id="'+parenttd+'" class="tdstyle1" style="cursor:hand" onclick="openChild(\''+childtd+'\')">'+xmlNode.getAttribute("Name")+'</td></tr>';
        }
        else
        {
            var paddingleft = sd * 15;
            if(!xmlNode.hasChildNodes)
                html += '<tr><td id="'+parenttd+'" class="tdstyle1" style="padding-left:'+paddingleft+'px">'+xmlNode.getAttribute("Name")+'</td></tr>';
            else
                html += '<tr><td id="'+parenttd+'" class="tdstyle1" style="cursor:hand" onclick="openChild(\''+childtd+'\')" style="padding-left:'+paddingleft+'px">'+xmlNode.getAttribute("Name")+'</td></tr>';
        }
        
        if(xmlNode.hasChildNodes)
        {                                             
            html += '<tr><td id="'+childtd+'" style="display:none"><table cellpadding="0" cellspacing="0">';             
            createMenu(xmlNode,sd);
            html+="</table></td></tr>" ;
        } 
         
    }      
}
function findParent(xmlNode)
{    var i=0
    while(xmlNode.parentNode)
    {
        i++;
        xmlNode=xmlNode.parentNode;
    }
    return i-1;
}
function openChild(obj)
{
    if($(obj).style.display=="none")
        $(obj).style.display = "block";
    else
        $(obj).style.display="none";
}
</script>

<table border="1" width="200" cellpadding="0" style="font-family:楷体_GB2312" cellspacing="0">
<tr>
<td>
<div id="divMenu"></div>
</td>
</tr>
</table>
</form>
</body>
</html>



XML code

xml文件
<?xml version="1.0" encoding="utf-8"?&g