Ajax读取XML实现动态下拉导航

　　//id为自身id，pid为父级分类ID

　　<?xml version="1.0" encoding="UTF-8" ?>

　　<Proot>

　　<Item id="1" pid="0">1321系列</Item>

　　<Item id="2" pid="1">43223系列</Item>

　　</Proot>

　　var root;

　　//FireFox不支持selectNodes方法，在网上找到这段代码解决了这个问题。兼容了IE和FireFox.

　　//创建selectNodes方法

　　if( document.implementation.hasFeature("XPath", "3.0") )

　　{

　　// prototying the XMLDocument

　　XMLDocument.prototype.selectNodes = function(cXPathString, xNode)

　　{

　　if( !xNode ) { xNode = this; }

　　var oNSResolver = this.createNSResolver(this.documentElement)

　　var aItems = this.evaluate(cXPathString, xNode, oNSResolver,

　　XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null)

　　var aResult = [];

　　for( var i = 0; i < aItems.snapshotLength; i++)

　　{

　　aResult[i] =  aItems.snapshotItem(i);

　　}

　　return aResult;

　　}

　　// prototying the Element

　　Element.prototype.selectNodes = function(cXPathString)

　　{

　　if(this.ownerDocument.selectNodes)

　　{

　　return this.ownerDocument.selectNodes(cXPathString, this);

　　}

　　else{throw "For XML Elements Only";}

　　}

　　}

　　function createXMLHttpRequest() {

　　if (window.ActiveXObject) {

　　oXmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

　　}

　　else if (window.XMLHttpRequest) {

　　oXmlHttp = new XMLHttpRequest();

　　}

　　}

　　function CreateXMLDOM()

　　{

　　createXMLHttpRequest();

　　oXmlHttp.open( "GET", "XML路径", false ) ;

　　oXmlHttp.send(null) ;

　　root = oXmlHttp.responseXML.documentElement;

　　}

　　CreateXMLDOM()

　　function funCreatePullMenu(passPid,ChildId)

　　{

　　var currentItems = root.selectNodes("//Proot/Item[@pid = " + passPid + "]");

　　var iItems = currentItems.length;

　　var k=0;

　　if(iItems > 0)

　　{

　　var pdiv = 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(var i = 0; i < iItems; i++)

　　{

　　var _id = currentItems[i].attributes[0].value;

　　var newChild = document.createElement("DIV");

　　newChild.id="div" + _id;

　　newChild.className = "div" + ChildId;

　　newChild.name = "div" + _id;

　　var _v ;

　　if(CheckPullMenu(_id))

　　{

　　_1= _id

　　_v = "<a href='javascript:showsubmenu(" + _1 + ")'> " +currentItems[i].firstChild.data + "</a>";

　　}

　　else

　　{

　　_v = "<a href='ProductList.aspx?type=" + _id + "'>"+ currentItems[i].firstChild.data +"</a>";

　　}

　　newChild.innerHTML=_v;

　　document.getElementById("piv" + passPid).appendChild(newChild);

　　if(CheckPullMenu(_id))

　　{

　　funCreatePullMenu(_id,ChildId+1)

　　}

　　}

　　}

　　}

　　//检测是否有下级

　　function CheckPullMenu(passPid)

　　{

　　var currentItems = root.selectNodes("//Proot/Item[@pid = " + passPid + "]");

　　var iItems = currentItems.length;

　　if(iItems > 0)

　　{

　　return true;

　　}

　　else

　　{

　　return false;

　　}

　　}

　　//显示隐藏层

　　function showsubmenu(sid)

　　{

　　var whichEl = document.getElementById( "piv" +sid);

　　if (whichEl.style.display == "none")

　　{

　　whichEl.style.display="block";

　　}

　　else

　　{

　　whichEl.style.display="none";

　　}

　　}