CSDN论坛http://community.csdn.net/是使用框架，
左边树形菜单和登录框是使用动态还是静态，静态的怎么实现，如果是静态页面树形菜单应该怎么实现，JS方法到数据 ` 库获取还是其他什么方法;
右边是动态的还是静态的，还是使用伪静态，如果使用静态的可以实现吗,
左边树形菜单和登录框是使用动态还是静态，静态的怎么实现，如果是静态页面树形菜单应该怎么实现，JS方法到数据 ` 库获取还是其他什么方法;
右边是动态的还是静态的，还是使用伪静态，如果使用静态的可以实现吗,
<head runat="server">
<title>不用控件生成树--自己生成树</title> <script type="text/javascript">
var xmlHttp;
function createXMLHttpRequest()
{
if(window.ActiveXObject)
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
else if(window.XMLHttpRequest)
xmlHttp=new XMLHttpRequest();
}
function getData()
{
if(xmlHttp==null)
createXMLHttpRequest();
xmlHttp.open("get","GetDataAjax.aspx?mode=0&date="+new Date().getTime(),true);
xmlHttp.onreadystatechange=stateChangeRoot;
xmlHttp.send(null);
}
//添加所有的根元素
function stateChangeRoot()
{
if(xmlHttp.readyState==4)
{
if(xmlHttp.status==200)
{
var data=xmlHttp.responseText;
var arrdata=data.split("∮"); //获取每一行的 ID Name 缩进
for(var i=0;i<arrdata.length;i++)
{
if(arrdata[i]!="")
{
var rootdivObj=document.createElement("div");
var bdivObj=document.createElement("div");
var id_NameSjRt=arrdata[i].split("∫");
var name_SjRt=id_NameSjRt[1].split("§");
var sj_Rt=name_SjRt[1].split("♂");
var treeImg=document.createElement("img");
treeImg.align="absmiddle";
treeImg.style.cursor="pointer";
if(sj_Rt[1]=="1")
{
treeImg.src="Image/plus.gif";
treeImg.onclick=function(){getChildNodes(this)};
}
else
{
treeImg.src="Image/joinbottom.gif";
}
var elementName=document.createElement("span");
elementName.appendChild(document.createTextNode(name_SjRt[0]));
elementName.onclick=function()
{
alert(this.firstChild.nodeValue);
};
elementName.style.cursor="pointer";
var textId=document.createTextNode(id_NameSjRt[0]); //textId 就是 此元素的ID
var span=document.createElement("span");
span.style.color="rgb(223,223,223)";
span.appendChild(textId);
var sj=sj_Rt[0]-0;
for(var j=0;j<sj;j++)
{
var emptyImg=document.createElement("img");
emptyImg.src="Image/empty.gif";
emptyImg.align="absmiddle";
bdivObj.appendChild(emptyImg);
}
bdivObj.appendChild(treeImg);
bdivObj.appendChild(elementName);
bdivObj.appendChild(span);
rootdivObj.appendChild(bdivObj);
document.getElementById("main_id").appendChild(rootdivObj);
}
}
}
}
function getChildNodes(th)
{
if(th.parentNode.parentNode.childNodes.length==1) //展开
{
if(xmlHttp==null)
createXMLHttpRequest();
th.src="Image/minus.gif";
var did=th.parentNode.lastChild.firstChild.nodeValue; //获取D_ID，其实就是ID
xmlHttp.open("get","GetDataAjax.aspx?mode=1&did="+did+"&date="+new Date().getTime(),true);
xmlHttp.onreadystatechange=function(){stateChangeChild(th.parentNode.parentNode)};
xmlHttp.send(null);
}
else //收缩
{
th.src="Image/plus.gif"
th.parentNode.parentNode.removeChild(th.parentNode.parentNode.lastChild);
}
}
//添加相应的子元素
function stateChangeChild(parentdivobj)
{
if(xmlHttp.readyState==4)
{
if(xmlHttp.status==200)
{
var childdivObj=document.createElement("div");
var data=xmlHttp.responseText;
var arrdata=data.split("∮");
for(var i=0;i<arrdata.length;i++)
{
if(arrdata[i]!="")
{
var bdivObj1=document.createElement("div");
var bdivObj2=document.createElement("div");
var id_NameSjRt=arrdata[i].split("∫");
var name_SjRt=id_NameSjRt[1].split("§");
var sj_Rt=name_SjRt[1].split("♂");
var treeImg=document.createElement("img");
treeImg.align="absmiddle";
treeImg.style.cursor="pointer";
if(sj_Rt[1]=="1")
{
treeImg.src="Image/plus.gif";
treeImg.onclick=function(){getChildNodes(this)};
}
else
{
treeImg.src="Image/joinbottom.gif";
} var elementName=document.createElement("span");
elementName.appendChild(document.createTextNode(name_SjRt[0]));
elementName.onclick=function()
{
alert(this.firstChild.nodeValue);
};
elementName.style.cursor="pointer";
var textId=document.createTextNode(id_NameSjRt[0]);
var span=document.createElement("span");
span.style.color="rgb(223,223,223)";
span.appendChild(textId);
var sj=sj_Rt[0]-0;
for(var j=0;j<sj;j++)
{
var emptyImg=document.createElement("img");
emptyImg.src="Image/empty.gif";
emptyImg.align="absmiddle";
bdivObj1.appendChild(emptyImg);
}
bdivObj1.appendChild(treeImg);
bdivObj1.appendChild(elementName);
bdivObj1.appendChild(span);
bdivObj2.appendChild(bdivObj1);
childdivObj.appendChild(bdivObj2);
}
}
parentdivobj.appendChild(childdivObj); document.getElementById("tx").value=document.getElementById("main_id").innerHTML
}
}
}
} </script>
</head>
<body style="font-size:10pt">
<form id="form1" runat="server">
<!--div默认就是相对定位-->
<div id="main_id" style="float:left;width:176px;height:362px;background-color:rgb(223,223,223)">
</div>
<div>
<input type="button" onclick="getData()" value="显示树">
<textarea id="tx" rows="20" cols="50"></textarea>
</div>
</form>
</body>
</html>
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;public partial class GetDataAjax : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
string mode = Request.QueryString["mode"].ToString(); if (mode == "0") //获取根元素
{
GetData("0");
}
else if (mode == "1") //获取相关子元素
{
string id=Request.QueryString["did"].ToString(); GetData(id);
} } public void GetData(string _id)
{
SqlConnection con = new SqlConnection("Data Source=wjj;Initial Catalog=Employee;User Id=wjj;Password=000150");
con.Open(); SqlCommand cmd = new SqlCommand("select * from Tree where D_ID='"+_id+"'", con); SqlDataReader dr = cmd.ExecuteReader(); string data = ""; while (dr.Read())
{
string id = dr["ID"].ToString();
string name = dr["Name"].ToString();
string sj = dr["S_J"].ToString(); string rt=GetExistsChild(id); //id name 缩进 是否是含有子节点
data = data + id + "∫" + name + "§"+sj+"♂"+rt+"∮"; //也可以封装在Xml文档中
} dr.Close();
cmd.Dispose();
con.Close(); Response.Write(data); Response.End();
} public string GetExistsChild(string id)
{
SqlConnection con = new SqlConnection("Data Source=wjj;Initial Catalog=Employee;User Id=wjj;Password=000150");
con.Open(); SqlCommand cmd = new SqlCommand("select * from Tree where D_ID='" + id + "'", con); SqlDataReader dr = cmd.ExecuteReader(); string rt = ""; if (dr.Read())
rt = "1";
else
rt = "0"; dr.Close();
cmd.Dispose();
con.Close(); return rt;
}
}
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head><body>
<div>
<ul id='navigation'><li><a href='Large-Size-Shoes-wholesale-304.html' title='Large Size Shoes'>Large Size Shoes (30)</a><ul><li><a href='Air-Force-1-wholesale-406.html' title='Air Force 1'>Air Force 1 (1)</a></li><li><a href='Gucci-Shoes-wholesale-405.html' title='Gucci Shoes'>Gucci Shoes (23)</a><ul><li><a href='Gucci-Low-Cut-wholesale-408.html' title='Gucci Low Cut'>Gucci Low Cut (11)</a></li><li><a href='Gucci-High-Cut-wholesale-327.html' title='Gucci High Cut'>Gucci High Cut (12)</a></li></ul></li><li><a href='Jordan-Six-Rings-wholesale-407.html' title='Jordan Six Rings'>Jordan Six Rings (5)</a></li><li><a href='Jordan-24-Fusion-wholesale-410.html' title='Jordan 24 Fusion'>Jordan 24 Fusion (1)</a></li></ul></li></ul>
</div>
</body>
</html>
比如这样一段HTML怎样用CSS来控制树的展开和关闭，可以再里面加ID等只有是可以控制