产品分类的XML文件
复制代码 代码如下:
//id为自身id，pid为父级分类ID
js代码
复制代码 代码如下:
varroot;
//FireFox不支持selectNodes方法，在网上找到这段代码解决了这个问题。兼容了IE和FireFox.
//创建selectNodes方法
if(document.implementation.hasFeature("XPath","3.0"))
{
//prototyingtheXMLDocument
XMLDocument.prototype.selectNodes=function(cXPathString,xNode)
{
if(!xNode){xNode=this;}
varoNSResolver=this.createNSResolver(this.documentElement)
varaItems=this.evaluate(cXPathString,xNode,oNSResolver,
XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,null)
varaResult=[];
for(vari=0;i
aResult[i]=aItems.snapshotItem(i);
}
returnaResult;
}
//prototyingtheElement
Element.prototype.selectNodes=function(cXPathString)
{
if(this.ownerDocument.selectNodes)
{
returnthis.ownerDocument.selectNodes(cXPathString,this);
}
else{throw"ForXMLElementsOnly";}
}
}
functioncreateXMLHttpRequest(){
if(window.ActiveXObject){
oXmlHttp=newActiveXObject("Microsoft.XMLHTTP");
}
elseif(window.XMLHttpRequest){
oXmlHttp=newXMLHttpRequest();
}
}
functionCreateXMLDOM()
{
createXMLHttpRequest();
oXmlHttp.open("GET","XML路径",false);
oXmlHttp.send(null);
root=oXmlHttp.responseXML.documentElement;
}
CreateXMLDOM()
functionfunCreatePullMenu(passPid,ChildId)
{
varcurrentItems=root.selectNodes("//Proot/Item[@pid="+passPid+"]");
variItems=currentItems.length;
vark=0;
if(iItems>0)
{
varpdiv=document.createElement("DIV");
pdiv.id="piv"+passPid;
pdiv.className="piv"+ChildId;
pdiv.name="piv"+passPid;
if(passPid>0)
{
pdiv.style.display="none";
document.getElementById("div"+passPid).appendChild(pdiv);
}
else
{
document.getElementById("odiv").appendChild(pdiv);
}
for(vari=0;i
var_id=currentItems[i].attributes[0].value;
varnewChild=document.createElement("DIV");
newChild.id="div"+_id;
newChild.className="div"+ChildId;
newChild.name="div"+_id;
var_v;
if(CheckPullMenu(_id))
{
_1=_id
_v="
}
else
{
_v="
}
newChild.innerHTML=_v;
document.getElementById("piv"+passPid).appendChild(newChild);
if(CheckPullMenu(_id))
{
funCreatePullMenu(_id,ChildId+1)
}
}
}
}
//检测是否有下级
functionCheckPullMenu(passPid)
{
varcurrentItems=root.selectNodes("//Proot/Item[@pid="+passPid+"]");
variItems=currentItems.length;
if(iItems>0)
{
returntrue;
}
else
{
returnfalse;
}
}
//显示隐藏层
functionshowsubmenu(sid)
{
varwhichEl=document.getElementById("piv"+sid);
if(whichEl.style.display=="none")
{
whichEl.style.display="block";
}
else
{
whichEl.style.display="none";
}
}
使用方法：在网页中加入"
最终效果：
可以在代码中增加定义CSS。达到更好的效果。
原发于：http://www.23mo.com/blog/article.asp?id=16
使用方法：在网页中加入"
最终效果：
可以在代码中增加定义CSS。达到更好的效果。
原发于：http://www.23mo.com/blog/article.asp?id=16
