用ajax和JQuery TreeView 编一个动态的树形结构
最近在做一个项目，就是在老的版本上添加和修改功能。
技术支持：jdk1.4，struts1.0，ibatis2.0，PSQL，javascript，jquery。
我的做的一小部分是将一个表型结构的数据集合，变成一个树形结构的显示出来。经过调查JQuery TreeView可以实现。刚开始做的时候是以一种静态树显示出来。由于自己小组做的数据库的数据太少（拼成字符串340K），显示出来是没问题的。但是到了客户给的数据（拼成字符串12M）时就内存溢出，那个悲剧啊。后来只能重新调查，发现JQuery TreeView还是可以支持动态树的，但是按照网上所说的方法去做，怎么试也试不出来，郁闷 ；迫不得已，只能自己动手了。直接上代码吧。

<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib uri="/WEB-INF/tld/struts-html.tld" prefix="html"%>
<%@ taglib uri="/WEB-INF/tld/struts-bean.tld" prefix="bean"%>
<%@ taglib uri="/WEB-INF/tld/biosam.tld" prefix="biosam"%>
<%@ taglib uri="/WEB-INF/tld/struts-logic.tld" prefix="logic"%>
<link rel="stylesheet" type="text/css" href="css/jquery.treeview.css">
<script language="javascript" type="text/javascript" src="js/jquery.numeric.js"></script>
<script type="text/javascript" language="javascript" src="js/jquery.treeview.js"></script>
<script type="text/javascript">
        //JQuery树的展现
	$(document).ready(function(){
    	$("#black").treeview({});
	});
	//通过ajax调用到后台得到树的节点
	function getTreeNode(taxonId) {
	 var xmlHttp;
	 var getTreeNodeUrl = 'treeSource.do?taxonId='+taxonId;
	 var ulId ='ul' + taxonId.substring(2);
	 try {
	   // Firefox, Opera 8.0+, Safari
	   	 xmlHttp = new XMLHttpRequest();
	    } catch (e){
	  // Internet Explorer
		   try {
		     	 xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
		      }catch (e) {
		      try {
		         xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
		         }catch(e) {
			         return false;
		         }
		      }
	    }
	    xmlHttp.onreadystatechange = function() {
	      if(xmlHttp.readyState == 4 && xmlHttp.responseXML) {
	       //通过ajax得到数据变成xml标签
	        var searchResult = xmlHttp.responseXML;
	        var treeList =  searchResult.getElementsByTagName('node');
                //得到想要的数据并拼成显示的字符串
	        if(treeList.length != 0) {
	        	for(var i=0 ; i<treeList.length ; i++) {
	        	 var treeStr = '';
	        		var tree = treeList.item(i);
					var eltaxonId = tree.getElementsByTagName('taxonID');
					var taxonId = eltaxonId.item(0).firstChild.nodeValue.trim();
					var eltaxonText = tree.getElementsByTagName('taxonText');
					var taxonText = eltaxonText.item(0).firstChild.nodeValue.trim();
					var elchilds = tree.getElementsByTagName('taxonSubCount');
					var childs = elchilds.item(0).firstChild.nodeValue.trim();
					var elsearchStr = tree.getElementsByTagName('taxonSearchStr');
					var searchStr = elsearchStr.item(0).firstChild.nodeValue.trim();
					treeStr = treeStr + "<li class='closed' ";
					treeStr = treeStr + "id='li" + taxonId + "' value='0' ";
					if(childs > 0) {
						treeStr = treeStr + "onclick='checkTreeNode(this)' >";
					} else {
						treeStr = treeStr + ">";
					}
					treeStr = treeStr + "<span onclick='changeColor(this)' id='span";
					treeStr = treeStr + taxonId + "' value='0'>";
					treeStr = treeStr + "<a style='text-decoration:none' onclick=\"";
					treeStr = treeStr + "doSel(this,'" + searchStr + "')\" ";
					treeStr = treeStr + "id='a" + taxonId + "' >";
					treeStr = treeStr + taxonText;
					if(childs > 0) {
						treeStr = treeStr + " [" + childs + " Records]";
						treeStr = treeStr + "</a>";
						treeStr = treeStr + "</span>";	
						treeStr = treeStr +"<ul id='ul" + taxonId + "'></ul>";
					} else {
						treeStr = treeStr + "</a>";
						treeStr = treeStr + "</span>";
					}
					treeStr = treeStr + "</li>";
					
					var branches = $(treeStr).appendTo("#"+ulId);
                        //刷新树
			$("#black").treeview({
				add: branches
			});	 
	        	}
	        }
			
	        }
	     }
	    xmlHttp.open("POST",getTreeNodeUrl,true);
	    xmlHttp.send(null);
	}
	//树节点作为检索条件，传入字符串
	function doS