无限级菜单结构与 Javascript 实现算法, 类 XMenu by shawl.qiu

最新推荐文章于 2025-04-05 20:55:33 发布

btbtd

最新推荐文章于 2025-04-05 20:55:33 发布

阅读量5k

点赞数

文章标签： javascript 算法 function constructor string null

本文链接：https://blog.youkuaiyun.com/btbtd/article/details/1868738

版权

Me Script 同时被 3 个专栏收录

88 篇文章

订阅专栏

MS Access

36 篇文章

订阅专栏

Me Script function library

34 篇文章

订阅专栏

无限级菜单结构与 Javascript 实现算法, 类 XMenu by shawl.qiu

说明:
鄙人曾经写过一个无限级菜单的JS类 Menu:
shawl.qiu Javascript 智能无限级导航菜单类 Menu class v1.0
详细见:
http://blog.youkuaiyun.com/btbtd/archive/2007/05/21/1619755.aspx

不过, 上面那个菜单是使用多表分类实现之, 在效率问题, 数据查询方面会有一点小问题, JS方面还是可以的...

最近在学什么数据结构呀算法的这些个东西, 所以就写了这个类了...

表结构:

Access

二级分类表(CatTabl)表结构:
CId Autoincrement
CName Text(255)
CPId long;
CTreeNode Text8)

CPId 存放父类ID, 顶级分类为 0
CTreeNode 存放父类信息, 每分类占四个字符
如: 00010000 代表父类ID为1
如: 00010001 代表父类ID为1, 子类为1

三级分类表(CatTabl)表结构:
CId Autoincrement
CName Text(255)
CPId long;
CTreeNode Text(12)

CPId 存放父类ID, 顶级分类为 0
CTreeNode 存放父类信息, 每分类占四个字符
如: 000100000000 代表父类ID为1
如: 000100010000 代表父类ID为1, 子类为1
如: 000100010001 代表父类ID为1, 子类为1, 子子类为1

如此类推至N个分类...

注: CTreeNode 字段对JS算法来说没作用, 但对数据排序和查找的效率起着关键作用, Js 算法只需 CId, CName, CPId 三个字段

数据方法使用 Ado RecordSet GetString 方法的字串
格式为 CId##CName##CPId##@[,CId##CName##CPId##@]

CSharp GetString 实现方法:

public static string GetString(DataTable Dt, string sCol, string sRow, string sNull)
{ // shawl.qiu code
  StringBuilder Sb = new StringBuilder();

  int Len = Dt.Rows.Count;

  if(Len==0) return "";
  int SubLen = Dt.Rows[0].ItemArray.Length;
  string TempString = "";
  for(int i=0; i<Len; i++)
  {
   for(int j=0; j<SubLen; j++)
   {
    TempString = Dt.Rows[i].ItemArray[j].ToString();

    if(TempString=="")
    {
     Sb.Append(sNull);
    }
    else
    {
     Sb.Append(TempString);
    }

    Sb.Append(sCol);
   } // end for(int j=0; j<SubLen; j++)
   Sb.Append(sRow);
  } // end for(int i=0; i<Len; i++)

  return Sb.ToString();
} // end public static string GetString(DataTable Dt, string sCol, string sRow, string sNull)

调用:

string CodeNav = GetString(MenuTbl, "##", "##@", "");

shawl.qiu
2007-11-06
http://blog.youkuaiyun.com/btbtd

下载:(含类: Menu, XMenu)
http://download.youkuaiyun.com/source/278241
http://dl2.youkuaiyun.com/down4/20071106/06012044995.7z

目录:
1. 二级分类调用(XMenu(Hor_2).htm)
2. 三级分类调用(XMenu(Hor_3).htm)
3. XMenu.js

内容:
1. 二级分类调用(XMenu(Hor_2).htm)

2. 三级分类调用(XMenu(Hor_3).htm)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>shawl.qiu template </title>
<style type="text/css">
/* <![CDATA[ */

body
{
margin:10px 10px;
background-color:#fff;
font: 14px Arial, Helvetica, sans-serif, 宋体;
}

* a, * a:visited
{
text-decoration:none;
}

/* ]]> */
</style>
<script type="text/javascript">
/*<![CDATA[*/
if (navigator.appName=="Microsoft Internet Explorer")
{
  //最大化窗口
  self.moveTo(-5,-5)
  self.resizeTo(screen.availWidth +8,screen.availHeight+8)
  //这个脚本定义的宽度其实比原窗口还要大那么一点.
}
/*]]*/
</script>
</head>
<body>

<div id="MenuField">
</div>
<script type="text/javascript" src="XMenu.js"> </script>
<script type="text/javascript">
/*<![CDATA[*/
var MenuStr = "1##JScript##0####@5##JavaScript##0####@7##VBScript##0####@15##ActionScript##0####@12##CSharp .Net##0####@11##JScript .Net##0####@17##PHP##0####@10##Sql##0####@13##xhtml##0####@14##xml##0####@9##CSS##0####@18##C ++##0####@16##Utility##0####@20##Algorithm##0####@21##Layout##0####@8##测试类##0####@22##函数库##1####@23##类库##1####@26##prototype库##1####@74##范例 ##1####@33##模板库##1####@25##杂类##1####@31##函数收藏##1####@29##函数库 ##5####@28## 类库##5####@53##枚举##5####@24##小工具##5####@69##范例##5####@57##模板库##5####@55## 收藏##5####@35##函数库##7####@27##类库##7####@30##导航##9####@78##范例##9####@34##模板库##9####@58##其他 ##9####@32##Access##10####@47##TSql##10####@50##数据表模板 ##10####@79##参考 ##10####@36##函数库##11####@37##类库##11####@39##函数库 ##12####@76##函数库(控制台) ##12####@45##函数收藏##12####@44##控件库 ##12####@40##static 库##12####@38##类库 ##12####@46##名称空间##12####@54##开发小工具##12####@75##范例 ##12####@52##其他 ##12####@42##模板库##12####@41##普通应用##13####@56##模板库 ##13####@43##模板库 ##14####@48##函数库##15####@49##类库##15####@72##正则库 ##16####@61##原始数据 ##16####@60##Search And Replace##16####@59##System##16####@73##Data Structure##16####@51##Server##16####@62## 函数库##17####@63##类库##17####@64## 模板库##17####@66##函数库##18####@67##类库 ##18####@65##范例##18####@68##模板库 ##18####@70##算法模型##20####@71##运算符及例子 ##20####@77##其他 ##20####@81##List##21####@85##Footer##21####@84##Header##21####@83##SideBar##21####@82##Page##21####@80##Edit##21####@186## 数据操作##22####@190##文件##22####@172##测试##22####@187##数据操作 ##23####@165##DOM##29####@183##事件##29####@182##时间日期##29####@195##属性扩展 ##29####@189##统计##32####@175##基本操作##32####@168##VBA##32####@171##参考 ##32####@192##文件函数##35####@181##日期时间##39####@191##文件操作##39####@178##路径 ##39####@188##数据操作##39####@196##字符串##39####@162##aspx 页模板 ##42####@160##asax 页模板##42####@169##XML##42####@184##数据绑定 ##42####@161##ascx 页模板##42####@166##Html Templates##42####@174##函数库 ##47####@180##其他##47####@170##版权写法 ##56####@173##范例模板##65####@179##普通正则 ##72####@176##脚本##75####@177##控件 ##75####@185##数据绑定##75####@193##页面 ##75####@194##值转换 ##75####@163##Category##80####@167##Post and Edit##80####@164##Display##82####@";

var xMenu = new XMenu();

var Au = xMenu.Get.Au();
document.title = Au.Subject+" "+Au.Version;

var StartDt = new Date();

xMenu.Go(fXMenuIniter);

defaultStatus = new Date()-StartDt;

xMenu = null;

function fXMenuIniter(Param)
{
  Param.Element = "MenuField";
  Param.String[0] = MenuStr;

  Param.ColumnDelimiter = "##";
  Param.RowDelimiter = "##@";

  Param.Level = 3;
  Param.ArrowText = " ->";

  Param.Prefix = "?cid=";
  Param.Suffix = "";

  Param.Query.Id = "cid";
  //function fAddLinkhighlight(sBgColor, sFgColor, Param)
  Param.Query.Highlight.Add("black", "white", Param);
  Param.Query.Highlight.Add("brown", "white", Param);
  Param.Query.Highlight.Add("red", "white", Param);

  Param.DisplayStyle.DefaultStyle = "Hor";

  Param.FixMemoryLeak = true;
} // end function fXMenuIniter(Param)

function fDisplayStyle(sOrder)
{
  var xMenu = new XMenu();

  var StartDt = new Date();

  xMenu.Go(fXMenuIniter);

  defaultStatus = new Date()-StartDt;

  xMenu = null;

  function fXMenuIniter(Param)
  {
   Param.Element = "MenuField";
   Param.String[0] = MenuStr;

   Param.ColumnDelimiter = "##";
   Param.RowDelimiter = "##@";

   Param.Level = 3
   Param.ArrowText = " ->";

   Param.Prefix = "?cid=";
   Param.Suffix = "";

   Param.Query.Id = "cid";
   //function fAddLinkhighlight(sBgColor, sFgColor, Param)
   Param.Query.Highlight.Add("black", "white", Param);
   Param.Query.Highlight.Add("brown", "white", Param);
   Param.Query.Highlight.Add("red", "white", Param);

   Param.DisplayStyle.DefaultStyle = sOrder;

   Param.FixMemoryLeak = true;
  } // end function fXMenuIniter(Param)
}
/*]]*/
</script>
<div style="text-align:right; margin:10px 5px;">
<input type="button" οnclick="fDisplayStyle('Vert')" value="垂直" />
<input type="button" οnclick="fDisplayStyle('Hor')" value="水平" />
</div
</body>
</html>

3. XMenu.js

// shawl.qiu JavaScript Document
/*-----------------------------------------------------------------------------------*/
* shawl.qiu Javascript XMenu class v1.0
/*-----------------------------------------------------------------------------------*/
//---------------------------------begin class XMenu()-------------------------------//
function XMenu()
{ // shawl.qiu code
//------------------------------------begin initer
//if(fIsFunc(fIniter)) fIniter(Param);
//------------------------------------end initer

//------------------------------------begin public variable
//------------------------------------end public variable

//------------------------------------begin private variable
//---------------begin about
var Au = {};
  Au.Subject = "shawl.qiu Javascript XMenu class";
  Au.Version = "v1.0";
  Au.Name = "shawl.qiu";
  Au.Email = "shawl.qiu@gmail.com";
  Au.Blog = "http://blog.youkuaiyun.com/btbtd/";
  Au.CreatedDate = "2007-11-4 v1.0";
  Au.Update = {};
  Au.Update["1"] = "";
//---------------end about

var This = this;

var Param = {};

Param.Element = null;
Param.String = [null];

Param.ColumnDelimiter = "##";
Param.RowDelimiter = "##@";

Param.ArrowText = " ->";

Param.Level = 3;

Param.Prefix = "";
Param.Suffix = "";

Param.Query = {}
Param.Query.Id = "cid";
Param.Query.Highlight = {};
Param.Query.Highlight.Set = [];
Param.Query.Highlight.Add = fAddLinkhighlight;

Param.Style = {};
Param.Style.Width = 100;
Param.Style.PlusLeft = 3;
Param.Style.BgColor = "whitesmoke";
Param.Style.Padding = "2px 0px 2px 0px";

Param.DisplayStyle = {};
Param.DisplayStyle.DefaultStyle = "Hor";

//---------------------------------------

Param.DisplayStyle.Hor = {}
Param.DisplayStyle.Hor.Bool = false;

Param.DisplayStyle.Hor.Main = {}
Param.DisplayStyle.Hor.Main.Float = "left";
Param.DisplayStyle.Hor.Main.Display = "black";
Param.DisplayStyle.Hor.Main.Width = "99.5%";
Param.DisplayStyle.Hor.Main.Height = "auto";
Param.DisplayStyle.Hor.Main.Addition = "";

Param.DisplayStyle.Hor.A = {}

Param.DisplayStyle.Hor.A.Top = new CssA();

Param.DisplayStyle.Hor.A.Top.Link.Width = "auto";
Param.DisplayStyle.Hor.A.Top.Link.Color = "black";
Param.DisplayStyle.Hor.A.Top.Link.Padding = "2px 5px";
Param.DisplayStyle.Hor.A.Top.Link.BorderBottom = "0px";//"1px solid black";

Param.DisplayStyle.Hor.A.Top.Hover.Color = "#fff";
Param.DisplayStyle.Hor.A.Top.Hover.BgColor = "#002BB8";

Param.DisplayStyle.Hor.A.Top.Visited.Paddding = "2px 5px";
Param.DisplayStyle.Hor.A.Top.Visited.BorderBottom = "0px";

Param.DisplayStyle.Hor.A.SubItem = new CssA();

Param.DisplayStyle.Hor.A.SubItem.Link.Color = "gray";
Param.DisplayStyle.Hor.A.SubItem.Link.WhiteSpace = "nowrap";
Param.DisplayStyle.Hor.A.SubItem.Link.BorderLeft = "4px solid whitesmoke";
Param.DisplayStyle.Hor.A.SubItem.Link.Overflow = "hidden";
Param.DisplayStyle.Hor.A.SubItem.Link.BorderBottom = "1px solid black";

Param.DisplayStyle.Hor.A.SubItem.Hover.Color = "white";
Param.DisplayStyle.Hor.A.SubItem.Hover.BgColor = "blue";

Param.DisplayStyle.Hor.A.SubItem.Visited.Color = "gainsboro";
Param.DisplayStyle.Hor.A.SubItem.Visited.BgColor = "whitesmoke";
Param.DisplayStyle.Hor.A.SubItem.Visited.Padding = "2px";
Param.DisplayStyle.Hor.A.SubItem.Visited.WhiteSpace = "nowrap";
Param.DisplayStyle.Hor.A.SubItem.Visited.BorderLeft = "4px solid whitesmoke";
Param.DisplayStyle.Hor.A.SubItem.Visited.Overflow = "hidden"
Param.DisplayStyle.Hor.A.SubItem.Visited.BorderBottom = "1px solid black";

Param.DisplayStyle.Hor.Item = {}
Param.DisplayStyle.Hor.Item.Overflow = "visible";
Param.DisplayStyle.Hor.Item.Border = "0px";
Param.DisplayStyle.Hor.Item.BottomStyle = "1px solid black";
Param.DisplayStyle.Hor.Item.BgColor = "whitesmoke";
Param.DisplayStyle.Hor.Item.Addition = "";

Param.DisplayStyle.Hor.Item.A  = {}
Param.DisplayStyle.Hor.Item.A.Color = "";
Param.DisplayStyle.Hor.Item.A.BgColor = "whitesmoke";
Param.DisplayStyle.Hor.Item.A.Margin = "0px 0px 1px 0px";
Param.DisplayStyle.Hor.Item.A.Padding = "1px 0px";
Param.DisplayStyle.Hor.Item.A.BorderBottom = "1px solid black";
Param.DisplayStyle.Hor.Item.A.Addition = "";

//-------------------------------

Param.DisplayStyle.Vert = {}
Param.DisplayStyle.Vert.Bool = false;

Param.DisplayStyle.Vert.Main = {}
Param.DisplayStyle.Vert.Main.Float = "none";
Param.DisplayStyle.Vert.Main.Display = "block";
Param.DisplayStyle.Vert.Main.Width = "120px";
Param.DisplayStyle.Vert.Main.Height = "auto";
Param.DisplayStyle.Hor.Main.Addition = "";

Param.DisplayStyle.Vert.A = {}

Param.DisplayStyle.Vert.A.Top = new CssA();

Param.DisplayStyle.Vert.A.Top.Link.Width = "120px";
Param.DisplayStyle.Vert.A.Top.Link.Color = "black";
Param.DisplayStyle.Vert.A.Top.Link.Padding = "2px 0px 2px 2px";
Param.DisplayStyle.Vert.A.Top.Link.BorderBottom = "1px solid black";

Param.DisplayStyle.Vert.A.Top.Hover.Color = "#fff";
Param.DisplayStyle.Vert.A.Top.Hover.BgColor = "#002BB8";

Param.DisplayStyle.Vert.A.Top.Visited.Paddding = "2px";
Param.DisplayStyle.Vert.A.Top.Visited.BorderBottom = "1px solid black";

Param.DisplayStyle.Vert.A.SubItem = new CssA();

Param.DisplayStyle.Vert.A.SubItem.Link.Color = "gray";
Param.DisplayStyle.Vert.A.SubItem.Link.WhiteSpace = "nowrap";
Param.DisplayStyle.Vert.A.SubItem.Link.Overflow = "hidden";
Param.DisplayStyle.Vert.A.SubItem.Link.BorderBottom = "1px solid black";

Param.DisplayStyle.Vert.A.SubItem.Hover.Color = "white";
Param.DisplayStyle.Vert.A.SubItem.Hover.BgColor = "blue";

Param.DisplayStyle.Vert.A.SubItem.Visited.Color = "gainsboro";
Param.DisplayStyle.Vert.A.SubItem.Visited.BgColor = "whitesmoke";
Param.DisplayStyle.Vert.A.SubItem.Visited.Padding = "2px";
Param.DisplayStyle.Vert.A.SubItem.Visited.WhiteSpace = "nowrap";
Param.DisplayStyle.Vert.A.SubItem.Visited.Overflow = "hidden";
Param.DisplayStyle.Vert.A.SubItem.Visited.BorderBottom = "1px solid black";

Param.DisplayStyle.Vert.Item = {}
Param.DisplayStyle.Vert.Item.Overflow = "visible";
Param.DisplayStyle.Vert.Item.Border = "0px";
Param.DisplayStyle.Vert.Item.BottomStyle = "1px solid black";
Param.DisplayStyle.Vert.Item.Addition = "";

Param.DisplayStyle.Vert.Item.A  = {}
Param.DisplayStyle.Vert.Item.A.Color = "";
Param.DisplayStyle.Vert.Item.A.BgColor = "whitesmoke";
Param.DisplayStyle.Vert.Item.A.Margin = "0px 0px 1px 0px";
Param.DisplayStyle.Vert.Item.A.Padding = "1px 0px";
Param.DisplayStyle.Vert.Item.A.BorderBottom = "1px solid black";
Param.DisplayStyle.Vert.Item.A.Addition = "";

Param.FixMemoryLeak = false;

var PVar = {};

PVar.Array = null;
PVar.Level = -2;
PVar.LevelArray = [];

PVar.Hb = null;

PVar.Element = null;

PVar.QueryString = "";

//------------------------------------end private variable

//------------------------------------begin public method
//-------------------Begin this.Get
this.Get = {};
this.Get.Au = fGetAu;
//-------------------End this.Get

//-------------------Begin this.Set
this.Set = {};
//-------------------End this.Set

this.Go = fGo;
//------------------------------------end public method

//------------------------------------begin initer
//if(fIsFunc(fIniter)) fIniter(Param);
//------------------------------------end initer

//------------------------------------begin private method
function fGo(fIniter)
{
  if(fIsFunc(fIniter)) fIniter(Param);

  Param.Element = fSetObject(Param.Element, "菜单主域不能为空!");
  Param.Element.innerHTML = "";

  if(fIsEmpty(Param.String))
  {
   fFatalError("菜单字串不能为空!");
  }

  PVar.Array = fMakeTable(Param.String);
  if(PVar.Array.length===0) return;

  if(!(Param.DisplayStyle.DefaultStyle in Param.DisplayStyle))
  {
   Param.DisplayStyle.DefaultStyle = "Hor";
  }

  fAppendDirectionCss(Param, Param.Style, Param.DisplayStyle[Param.DisplayStyle.DefaultStyle]);

  PVar.Level = Param.Level;

  PVar.Element = $("Span");
  PVar.Element.className = Param.Element.id+"Layout";

  PVar.QueryString = fQueryString(Param.Query.Id, true);

  fMakeTree(PVar.Element, PVar.Array, Param, "0", 0, PVar.Level, Param.Element.id, PVar);

  Param.Element.appendChild(PVar.Element);

  if((fCkBrs()===1||fCkBrs()===2)&&Param.FixMemoryLeak)
  {
   //onunload = function(){fFixMl();};
   fPlusEvent(window, "onunload", fFixMl);
  }

} // end function fGo

function fGetAu(){ return Au; }
//------------------------------------end private method
} // shawl.qiu code
//---------------------------------end class XMenu()---------------------------------//

function fMakeTree(oEle, oAr, Param, sFilter, iCurLevel, iMaxLevel, sPrefix, PVar)
{
var iNextLevel = iCurLevel+1;

var Len = oAr.length;

var ObjEle = {};

for(var i=0; i<Len; i++)
{
  var NodeItem = fTrim(oAr[i][0]);
  var PNode = fTrim(oAr[i][2]);
  var ItemName = NodeItem;

  var TempEle = $("span");

  if(PNode==sFilter)
  {
   ObjEle[ItemName] = TempEle;

   oEle.appendChild(ObjEle[ItemName]);

   var TempSubEle = $("span");

   TempSubEle.className = sPrefix+"HiddenSubItem";

   var LinkEle = $("a");
   LinkEle.href = Param.Prefix+NodeItem+Param.Suffix;
   LinkEle.innerHTML = oAr[i][1];
   LinkEle.title = oAr[i][1];

   if(sFilter=="0")
   {
    fMakeEventTop(ObjEle[ItemName], Param);

    ObjEle[ItemName].appendChild(LinkEle);
    ObjEle[ItemName].appendChild(TempSubEle);
   }
   else
   {
    fMakeEventSub(ObjEle[ItemName], Param);

    ObjEle[ItemName].appendChild(TempSubEle);
    ObjEle[ItemName].appendChild(LinkEle);
   }
   //ObjEle[ItemName].appendChild(_(" "));

   if(PVar.QueryString!="")
   {
    if(PVar.QueryString==NodeItem)
    {
     fMakeHighlight(Param, LinkEle, iCurLevel);
    }
   }

   if(iNextLevel<=iMaxLevel)
   {
    var TempAr = fGetRelativeArray(oAr, NodeItem);

    if(sFilter!="0"||Param.DisplayStyle.DefaultStyle!="Hor")
    {
     //document.write("<br/>TempAr.length: "+TempAr.length);

     if(TempAr.length>0)
     {
      LinkEle.innerHTML = "<font style='float:right;'> "+Param.ArrowText
      +"</font>"+LinkEle.innerHTML;
     }
    }
    arguments.callee(TempSubEle, TempAr, Param, NodeItem, iNextLevel, iMaxLevel, sPrefix, PVar)
   }

  } // end if(PNode=="0")
} // end for(var i=0; i<Len; i++)

//alert(oHb.Count())
} // end function fMakeTree(oHb, oEle, oAr)

function fMakeHighlight(Param, LinkEle, iCurLevel)
{
if(iCurLevel<0) return;

if(typeof(Param.Query.Highlight.Set[iCurLevel])!="undefined")
{
  LinkEle.style.backgroundColor = Param.Query.Highlight.Set[iCurLevel][0];
  LinkEle.style.color = Param.Query.Highlight.Set[iCurLevel][1];
}

if(iCurLevel>0)
{
  var Node = LinkEle.parentNode.parentNode.parentNode;

  if(Node!=null)
  {
   var Len = Node.childNodes.length;

   for(var i=0; i<Len; i++)
   {
    if(Node.childNodes[i].tagName=="A")
    {
     arguments.callee(Param, Node.childNodes[i], iCurLevel-1);
     break;
    }
   } // end for
  } // end if(Node!=null)
} // end if(iCurLevel>0)
//arguments.callee(Param, LinkEle, iCurLevel);

} // end function fMakeHighlight(Param, LinkEle, iCurLevel)

function fMakeEventSub(EleSpan, Param)
{
EleSpan.onmouseover =
  function(e)
  {
   if(!e) e = window.event;

   var Parent = this.parentNode;
   var ChildLen = this.childNodes.length;

   if(ChildLen<1)return;

   var EleA = this.childNodes[0];

   var iChildLen= 0 ;
   var iChildLenCount = 0;

   var iPlus = Param.Style.Width+Param.Style.PlusLeft;

   if(Param.DisplayStyle.DefaultStyle=="Hor")
   {
    iPlus+=9;
   }
   //Param.Style.PlusLeft

   while(iChildLen++<ChildLen)
   {
    if(this.childNodes[iChildLenCount].nodeName=="SPAN")
    {
     if(fTrim(this.childNodes[iChildLenCount].innerHTML)=="") continue;

     this.childNodes[iChildLenCount].className = Param.Element.id+"DisplaySubItem";

     this.childNodes[iChildLenCount].style.left =
      iPlus+"px";

     this.childNodes[iChildLenCount].onmouseout =
      function()
      {
       this.className = Param.Element.id+"HiddenSubItem";
      }
    }
    iChildLenCount++;
   } // end while(iChildLen++<ChildLen)

  } // end EleSpanContainer.onmouseover

  EleSpan.onmouseout =
  function(e)
  {
   var ChildLen = this.childNodes.length;
   var iChildLen = 0;

   while(iChildLen++<ChildLen)
   {
    if(this.childNodes[iChildLen-1].nodeName=="SPAN")
    {
     this.childNodes[iChildLen-1].className = Param.Element.id+"HiddenSubItem";
    }
   } // end while(iChildLen++<ChildLen)
  } // end EleSpanContainer.onmouseout
} // end function fMakeEventSub(EleSpan, sPrefix)

function fMakeEventTop(EleSpan, Param)
{

switch(Param.DisplayStyle.DefaultStyle)
{
  case "Vert":
   EleSpan.onmouseover =
    function()
    {
     if(this.childNodes.length<2) return;

     var Span = this.childNodes[1];

     if(true)//fCkBrs()==1
     {
      var MyParent = Span.parentNode;

      var MyTop = fFindPos(MyParent, true)+MyParent.offsetHeight;
      var MyLeft = fFindPos(MyParent);

      Span.style.top = fFindPos(MyParent,true)+"px";
      Span.style.left = fFindPos(MyParent)+MyParent.offsetWidth+"px";
     }

     Span.className = Param.Element.id+"DisplaySubItem";
    } // end EleSpanTop.onmouseover
   break;

  default:
   EleSpan.onmouseover =
    function()
    {
     if(this.childNodes.length<2) return;

     var Span = this.childNodes[1];

     if(fTrim(Span.innerHTML)=="") return;

     if(fCkBrs()==1)
     {
      var MyParent = Span.parentNode;

      var MyTop = fFindPos(MyParent, true)+MyParent.offsetHeight;
      var MyLeft = fFindPos(MyParent);

      Span.style.top = MyTop;
      Span.style.left = MyLeft;
     }

     Span.className = Param.Element.id+"DisplaySubItem";
    } // end EleSpan.onmouseover
  }

EleSpan.onmouseout =
  function()
  {
  if(this.childNodes.length<2) return;

  var Span = this.childNodes[1];
   Span.className = Param.Element.id+"HiddenSubItem";
  } // end EleSpanTop.onmouseout
} // end function fMakeEventTop(EleSpanTop)

function fGetRelativeArray(oAr, sFilter)
{
var Ar = [];

for(var i=0, j=oAr.length; i<j; i++)
{
  if(oAr[i][2]==sFilter)
  {
   Ar.push(oAr[i]);
  }
}

var Len = Ar.length;
if(Ar.length===0) return Ar;

for(var i=0, j=Len; i<j; i++)
{
  var TempAr = arguments.callee(oAr, Ar[i][0]);
  for(var I=0, J=TempAr.length; I<J; I++)
  {
   Ar.push(TempAr[I]);
  }
}

return Ar;
} // end function fGetRelativeArray(oAr, sFilter)

function fMakeTable(Source, sColDelimiter, sRowDelimiter)
{// shawl.qiu code, return array
if(Source.constructor==String) Source = [Source];
if(!sColDelimiter) sColDelimiter = "##";
if(!sRowDelimiter) sRowDelimiter = "##@";

var Ar = Source[0].split(sRowDelimiter);
var Len = Ar.length;

for(var i=0; i<Len; i++)
{
  Ar[i] = Ar[i].split(sColDelimiter);
} // end for(var i=0; i<Len; i++)

if(Len>2)
{
  if(Ar[0].length!==Ar[Len-1].length) Ar.pop();
}

return Ar;
} // end function fMakeTable(Source, sColDelimiter, sRowDelimiter)

function fIsFunc(Func)
{ // shawl.qiu code, return Boolean
if(Func) if(Func.constructor==Function) return true;
return false;
} // end function fIsFunc(Func)

function fIsEmpty(Source)
{// shawl.qiu code, return string
var bStr = false;
if(Source.constructor==String) Source = [Source], bStr = true;

return /^/s*$/.test(Source[0]);
} // end function fIsEmpty(Source)

function fSetObject(Obj, sMsg)
{// shawl.qiu code, return Element
if(!sMsg) sMsg = "无法获得对象!";

switch(Obj.constructor)
{
  case String:
   Obj = document.getElementById(Obj);
   break;

  case Array:
   Obj = Obj[0];
   break;
}

if(Obj==null) throw new Error(sMsg);

return Obj;
} // end function fSetObject(OldObj, NewObj, sMsg)

function fFatalError(sMsg)
{ // shawl.qiu code, void return
if(!sMsg) sMsg = "an fatal error occurring, program abort now!"
throw new Error(sMsg);
} // end function fFatalError(sMsg)

function $(sTag){return document.createElement(sTag);}
function _(sText){return document.createTextNode(sText);}

function fTrim(Source)
{// shawl.qiu code, return string
var bStr = false;
if(Source.constructor==String) Source = [Source], bStr = true;
Source[0] = Source[0].replace(/^/s+|/s+$/g,'');
if(bStr) return Source[0];
} // end function fTrim(Source)

function fFindPos(oEle, bReturnY)
{// shawl.qiu script
if(!oEle) throw new Error("元素不能为 null!");

if(bReturnY) return fFindPosY(oEle);
else return fFindPosX(oEle);

function fFindPosX(oEle)
{// shawl.qiu script
  var iLeft = 0;

  if(oEle.offsetParent)
  {
   while(true)
   {
    iLeft += oEle.offsetLeft;

    if(!oEle.offsetParent) break;
    oEle = oEle.offsetParent;
   } // end while
  }
  else if(oEle.x) Left += oEle.x;

  return iLeft;
} // end function fFindPosX

function fFindPosY(oEle)
{// shawl.qiu script
  var iTop = 0;

  if(oEle.offsetParent)
  {

   while(true)
   {
    iTop += oEle.offsetTop;

    if(!oEle.offsetParent) break;
    oEle = oEle.offsetParent;
   } // end while
  }
  else if(oEle.y) iTop += oEle.y;
  return iTop;
} // end function fFindPosX
} // end function fFindPos

function fCkBrs()
{// shawl.qiu script, return integer
switch (navigator.appName)
{
  case 'Opera': return 2;
  case 'Netscape': return 3;
  default: return 1;
}
} // end function fCkBrs

function fQueryString(sKey, bDecode, sLocationSearch, bDebug)
{ // shawl.qiu code, return string
var Debug = bDebug;
if(!sLocationSearch) sLocationSearch = location.search;
if(!sKey) return sLocationSearch;

var sTemp = sLocationSearch.replace(/^/?/,"");
if(Debug) alert(sTemp);

if(sTemp==""&&bDebug) throw new Error("页面 sLocationSearch 没有查询参数!");

var Ar = sTemp.split("&");
var sFinal = "";

var iArLen = Ar.length;
var iArCount = 0;

while(iArCount++<iArLen)
{
  if(Debug)
  {
   alert("Ar[iArCount-1].toLowerCase(): "+Ar[iArCount-1].toLowerCase());
   alert("sKey.toLowerCase()+'=': "+sKey.toLowerCase());
  }

  var arQsByPart = Ar[iArCount-1].split("=");
  if(arQsByPart[0].toLowerCase()==sKey.toLowerCase())
  {
   if(arQsByPart.length==1) continue;

   sFinal = arQsByPart[1];
   if(bDecode) sFinal = decodeURI(sFinal);
   break;
  }
} // end while(iArCount++iArLen)

if(sFinal==""&&bDebug) throw new Error("没有键为 "+sKey+" 的查询参数!");

return sFinal;
} // end function fQueryString

function fAddLinkhighlight(sBgColor, sFgColor, Param)
{
if(!sBgColor||!sFgColor) return;

var iIndex = Param.Query.Highlight.Set.length;
Param.Query.Highlight.Set[iIndex] = [];
Param.Query.Highlight.Set[iIndex][0] = sBgColor;
Param.Query.Highlight.Set[iIndex][1] = sFgColor;
} // end function fAddLinkhighlight

function fFixMl(oEle)
{ // shawl.qiu code, void return
if(!oEle)oEle=document.body;
var atr=oEle.attributes;
if(atr)
  for(var i=0, j=atr.length; i<j; i++)
   if(typeof oEle[atr[i].name]=='function')oEle[atr[i].name]=null;
if(oEle.childNodes)
  for(var i=0, j=oEle.childNodes.length; i<j; i++)
   arguments.callee(oEle.childNodes[i]);
} // end function fFixMl(oEle)

function fPlusEvent(Obj, sEvtName, Func)
{// shawl.qiu code, void return
if(document.addEventListener)
{
  sEvtName = sEvtName.replace(/^on/i, "");
  Obj.addEventListener(sEvtName, Func, false);
}
else if(document.attachEvent)
{
  if(Obj[sEvtName]==null)
  {
   Obj[sEvtName] = Func;
  }
  else
  {
   Obj.attachEvent(sEvtName, Func);
  }
}
} // end function fPlusEvent

function Style()
{
fCssStyleIniter(this);
}
Style.prototype.A = CssA;

function CssA()
{
fCssStyleIniter(this);
}
CssA.prototype.Link = CssAStyle;
CssA.prototype.Hover = CssAStyle;
CssA.prototype.Visited = CssAStyle;

function CssAStyle()
{
this.Addition = "";
this.BgColor = "whitesmoke";
this.Border = "0px";
this.BorderLeft = "0px";
this.Color = "black";
this.Margin = "0px";
this.Overflow = "auto";
this.Padding = "0px";
}

function fCssStyleIniter(Obj)// fCssStyleIniter(this);
{// shawl.qiu script
for(var i in Obj)
{
  if
  (
   typeof(Obj[i])=="function"
   &&
   (
    //bthis/./b[^/r/n;]+/=/.test(Obj[i])
    ||
    /fCssStyleIniter/(this/)/.test(Obj[i])
   )
  )
  {
   Obj[i] = new Obj[i];
  } // end if
} // end for
} // end function fCssStyleIniter

function fAppendDirectionCss(Param, StyleObj, StyleOrder)
{
var sMenuStyle = "";
var sId = Param.Element.id+"cssstyle";

sMenuStyle =
[
"."
,Param.Element.id
,"Layout"
,"{"
," display:block;"
," padding:"
,StyleObj.Padding
,";"
," background-color:"
,StyleObj.BgColor
,";"
,"width:"
,StyleOrder.Main.Width
,";"
,"height:"
,StyleOrder.Main.Height
,";"
, StyleOrder.Main.Addition
,"}"
,""
,"#"
,Param.Element.id
," span,"
,"#"
,Param.Element.id
," span span"
,"{"
," float:"
,StyleOrder.Main.Float
,";"
," display:"
,StyleOrder.Main.Display
,";"
,"}"
,""
,"#"
,Param.Element.id
," span span a:link"
,"{"
," padding:"
,StyleOrder.A.Top.Link.Padding
,";"
," width:"
,StyleOrder.A.Top.Link.Width
,";"
," border-bottom:"
,StyleOrder.A.Top.Link.BorderBottom
,";"

/*
  border-bottom: 1px solid black;
  background-color: whitesmoke;
*/
," display:block"
,";"
,StyleOrder.A.Top.Link.Addition
,"}"
,""
,"#"
,Param.Element.id
," span span a:hover"
,"{"
," background-color:"
,StyleOrder.A.Top.Hover.BgColor
,";"
," color:"
,StyleOrder.A.Top.Hover.Color
,"!important;"
,StyleOrder.A.Top.Hover.Addition
,"}"
,""
,"#"
,Param.Element.id
," span span a:visited"
,"{"
," padding:"
,StyleOrder.A.Top.Visited.Paddding
,";"
," display:block"
,";"
," border-bottom: "
,StyleOrder.A.Top.Visited.BorderBottom
,";"
,StyleOrder.A.Top.Visited.Addition
,"}"
,""
,"#"
,Param.Element.id
," span span span * a:link"
,"{"
," display:block;"
," overflow:"
,StyleOrder.A.SubItem.Link.Overflow
,";"
," width:"
,StyleObj.Width
,"px;"
," white-space:"
,StyleOrder.A.SubItem.Link.WhiteSpace
,";"
," color:"
,StyleOrder.A.SubItem.Link.Color
,";"
," border-left:"
,StyleOrder.A.SubItem.Link.BorderLeft
,";"
," border-bottom:"
,StyleOrder.A.SubItem.Visited.BorderBottom
,";"
,StyleOrder.A.SubItem.Link.Addition
,"}"
,""
,"#"
,Param.Element.id
," span span span * a:hover"
,"{"
," background-color: "
,StyleOrder.A.SubItem.Hover.BgColor
,";"
," color:"
,StyleOrder.A.SubItem.Hover.Color
,"!important;"
,StyleOrder.A.SubItem.Hover.Addition
,"}"
,""
,"#"
,Param.Element.id
," span span span * a:visited"
,"{"
," display:block;"
," width:"
,StyleObj.Width
,"px;"
," overflow:"
,StyleOrder.A.SubItem.Visited.Overflow
,";"
," white-space:"
,StyleOrder.A.SubItem.Visited.WhiteSpace
,";"
," background:"
,StyleOrder.A.SubItem.Visited.BgColor
,";"
," color:"
,StyleOrder.A.SubItem.Visited.Color
,"!important;"
," border-left:"
,StyleOrder.A.SubItem.Visited.BorderLeft
,";"
," border-bottom:"
,StyleOrder.A.SubItem.Visited.BorderBottom
,";"
,StyleOrder.A.SubItem.Visited.Addition
,"}"
,""
,"#"
,Param.Element.id
," * span."
, Param.Element.id
,"DisplaySubItem"
,"{"
," display:block;"
," position:absolute;"
," width:"
,StyleObj.Width
,"px;"
," overflow:"
,StyleOrder.Item.Overflow
,";"
," background-color: "
,StyleOrder.Item.BgColor
,";"
,StyleOrder.Item.Addition
,"}"
,""
,"#"
,Param.Element.id
," * span."
,Param.Element.id
,"DisplaySubItem a"
,"{"
," display:block;"
," background-color:"
,StyleOrder.Item.A.BgColor
,";"
," margin:"
,StyleOrder.Item.A.Margin
,";"
," padding:"
,StyleOrder.Item.A.Padding
,";"
," border-bottom:"
,StyleOrder.Item.A.BorderBottom
,";"
,StyleOrder.Item.A.Addition
,"}"
,""
,"#"
,Param.Element.id
," * span."
, Param.Element.id
,"HiddenSubItem"
,"{"
," display:none;"
,"}"
].join('');

//alert(sMenuStyle)
fAddStyleFromStr(sMenuStyle, sId);
} // end function fAppendDirectionCss

function fAddStyleFromStr(sIpt, sId)
{// shawl.qiu script, void return; func: fCkBrs, fRemoveSelfNode
fRemoveSelfNode(sId);
var EleStyle = document.createElement("style");
EleStyle.type = "text/css";
if(sId&&sId!="") EleStyle.id = sId;
if(fCkBrs()==1) EleStyle.styleSheet.cssText = sIpt;
else EleStyle.innerHTML = sIpt;
var EleHead=document.getElementsByTagName("head")[0]
if(!EleHead) EleHead=document.body;
EleHead.insertBefore(EleStyle, EleHead.firstChild);
} // end function fAddStyleFromStr

function fRemoveSelfNode(Obj)
{ // shawl.qiu code, return Boolean
switch(Obj.constructor)
{
  case String:
   Obj = document.getElementById(Obj);
   break;

  case Array:
   Obj = Obj[0];
   break;

  default:
   return false;
   break;
}
if(Obj==null) return false;
Obj.parentNode.removeChild(Obj);
return true;
} // end function fRemoveSelfNode(Obj)