xml谁能给一个简单的例子！100分献上

index.htm文件： 
<Html>
<Head>
<Title>菜单组件示例</Title>
<style>
<!--
.Menu{ border-top:2 solid #CCCCCC;border-bottom:1 solid #CCCCCC;border-left:2 solid #CCCCCC;border-right:1 solid #CCCCCC; }
.Up_Menu { border-top:2 outset;border-left:2 outset;border-right:1 outset #FFFFFF;border-bottom:1 outset #FFFFFF; background-color:#CCCCCC; }
.Dn_Menu{ border-top:2 inset ;border-left:2 inset ;border-right:1 inset ;border-bottom:1 inset ;background-color:#CCCCCC; }
-->
</style>
<script>
function HanderSubMenu(){//选择子菜单后相应处理
  switch(event.menuId){
    case event.menuId:
      alert(event.menuId);
      break;
  }
}
</script>
</Head>
<Body style="background-color:#CCCCCC;">
<TABLE style="font-size:12px;"> 
  <TBODY><TR height="10" >
    <TD Align="center" height=25 style="border-top:2px groove;border-bottom:2px groove;">
      <div id="Menu" style="behavior:url(Menu.htc)" xmlsrc="Menu.xml" onMenuClick="HanderSubMenu()"></div> 
    </TD>                   
  </TR>
  </TBODY>
</TABLE>
</Body>
</Html>
 

解决方案 »

  1.   

    <PUBLIC:COMPONENT>
    <PUBLIC:PROPERTY Name="xmlsrc" PUT="putxmlsrc"/>
    <PUBLIC:EVENT Name="onMenuClick" ID="menuClick" />
    <PUBLIC:ATTACH EVENT="ondocumentready" For="element" ONEVENT="MenuInit()" />
    <PUBLIC:ATTACH EVENT="onmouseover"  for="element" ONEVENT="MenuOver()" />
    <PUBLIC:ATTACH EVENT="onmouseout" for="element" ONEVENT="MenuOut()" />
    <PUBLIC:ATTACH EVENT="onclick"  for="element" ONEVENT="MenuClick()" />
    <Script language="JavaScript">
    var xmldoc=null;// xml文档对象变量
    var activeMenu=null;//打开子菜单的父菜单对象变量
    var menuContainer=null;//包含子菜单项容器对象变量
    function putxmlsrc(str){//载入菜单数据文件
      xmldoc= new ActiveXObject("Microsoft.XMLDOM");//创建xml文档对象
      xmldoc.async=false;
      xmldoc.load(str);//载入菜单数据
    }
    function MenuInit(){//初始化菜单
      var parentMenuItems = xmldoc.selectNodes("//Itemlist/Item"); //读取一级菜单数据    
      var xmlElement = parentMenuItems.nextNode(); 
      var newElement;     
      while (xmlElement != null){     
        newElement = document.createElement("span"); //创建菜单元素
        newElement.type = "parentMenu";    
        with (newElement){
          innerHTML = xmlElement.getAttribute("name"); 
          id=xmlElement.getAttribute("value"); 
          className="Menu";      
        }     
        with (newElement.style){     
          position="relative";
          width= 60;
          cursor="default";
        }     
        element.appendChild(newElement); //element指附加行为的元素     
        xmlElement = parentMenuItems.nextNode();       
      }
    }
    function MenuOver(){
      var EventSource=event.srcElement;//捕获触发事件的对象
      switch(activeMenu){//判断子菜单是否存在
        case null://不存在子菜单
          if(EventSource.type=="parentMenu")EventSource.className="Up_Menu";
          break;
        default:
          switch(EventSource.type){//判断触发事件对象类型
            case  "parentMenu"://移入到一级菜单
              if(activeMenu!=EventSource){//判断是否移入到新一级菜单
                removeSubMenu();//删除原有子菜单
                buildSubMenu(EventSource.id);//建立新子菜单
                EventSource.setCapture();//对新菜单设置鼠标捕获
                activeMenu.className="Menu";
                activeMenu=EventSource; //更新打开子菜单的父菜单对象变量
                activeMenu.className="Dn_Menu";
                }
              break;
            case "subMenu"://移入到子菜单
              EventSource.style.color="#FF0000";
              EventSource.style.textDecoration="underline";
              break;
          }
          break;
      }
    }
    function MenuOut(){
      EventSource=event.srcElement         
      switch(activeMenu){
        case null:
          if(EventSource.type=="parentMenu")EventSource.className="Menu";
          break;
        default:
          if(EventSource.type=="subMenu"){
            EventSource.style.color="#000000";
            EventSource.style.textDecoration="none";
          }
          break;
      }
    }
    function MenuClick(){
      EventSource=event.srcElement
      switch(EventSource.type){
        case "parentMenu":
          if(activeMenu!=EventSource){
            removeSubMenu();
            buildSubMenu(EventSource.id);
            EventSource.setCapture();
            EventSource.className="Dn_Menu";
            activeMenu=EventSource;
          }
          break;
        case "subMenu":
          removeSubMenu();
          activeMenu.className="Menu";
          activeMenu.releaseCapture();//释放鼠标捕获设置
          activeMenu=null;
          var eventObject = createEventObject();//创建事件对象
          eventObject.menuId = EventSource.id;//通过事件对象属性传递所选子菜单ID
          menuClick.fire(eventObject);//将事件触发到容器页面
          break;  
        default:
          removeSubMenu();
          if(activeMenu!=null){
            activeMenu.releaseCapture();
            activeMenu.className="Menu";
            activeMenu=null;
           } 
          break;
      } 
    }
    function buildSubMenu(EventSourceid){//建立子菜单
      menuContainer = document.createElement("div");
      with (menuContainer.style){ 
        position="absolute";
        left=0;
        top=15;
        color="#000000";
        cursor="default";
      }
      eval(EventSourceid).appendChild(menuContainer);
      var subMenuItems = xmldoc.selectNodes("//Item[@value='"+EventSourceid+"']/SubMenu");
      var xmlElement = subMenuItems.nextNode();  
      var newElement;
      while (xmlElement != null){      
        newElement = document.createElement("div");      
        newElement.type = "subMenu";
        with (newElement){      
          innerHTML ="□ "+xmlElement.getAttribute("name");      
          id=xmlElement.getAttribute("value");
        }      
        with (newElement.style){
          width=75;
          height=18;
        }      
        menuContainer.appendChild(newElement);
        menuContainer.className="Up_Menu";       
        xmlElement = subMenuItems.nextNode();        
      }
    }
    function removeSubMenu(){//删除子菜单
      if(menuContainer!=null)menuContainer.removeNode(true);
    }
    </Script>
    </Component>
      

  2.   

    <?xml version="1.0" encoding="gb2312" ?>//xml处理指令指明为中文编码,若不指明则不支持中文
    <Itemlist>
      <Item value="file" name="文件" > 
        <SubMenu value="New" name="新建"></SubMenu>
        <SubMenu value="Open" name="打开"></SubMenu>
        <SubMenu value="Save" name="保存"></SubMenu>
        <SubMenu value="Print" name="打印"></SubMenu>
        <SubMenu value="Exit" name="退出"></SubMenu>
      </Item> 
      <Item value="Edit" name="编辑" >
        <SubMenu value="Cut" name="剪切"></SubMenu>
        <SubMenu value="Copy" name="复制"></SubMenu>
        <SubMenu value="Paste" name="粘贴"></SubMenu>
        <SubMenu value="Del" name="删除"></SubMenu>
      </Item>
      <Item value="Help" name="帮助">
        <SubMenu value="Topic" name="主题"></SubMenu>
        <SubMenu value="About" name="关于"></SubMenu>
      </Item>
    </Itemlist>
      

  3.   

    楼上的给的我有想要一个纯js+html+xml的树
    <?xml version="1.0" encoding="gb2312"?>
    <caidan>
      <item name="我是一个夹" type="folder">
         <item name="我是一个菜单" type="file">nnnnnn</item>
         <item name="我是一个菜单" type="file">nn</item>
         <item name="我是一个菜单" type="file">nnn</item>
         <item name="我是一个菜单" type="file">nnn</item>
         <item name="我是一个菜单" type="file">nnn</item>
         <item name="我是一个菜单" type="file">nnn</item>
         <item name="我是一个菜单" type="file">nnn</item>
         <item name="我是一个夹" type="folder">
            <item name="我是一个菜单" type="file">nnnn</item>
            <item name="我是一个菜单" type="file">nnn</item>
            <item name="我是一个菜单" type="file">nnn</item>
              <item name="我是一个夹" type="folder">
               <item name="我是一个菜单" type="file">nnn</item>
               <item name="我是一个菜单" type="file">nnn</item>
               <item name="我是一个菜单" type="file">nnn</item>
              </item>
         </item>
      </item>
    </caidan>
      

  4.   

    var parentMenuItems = xmldoc.selectNodes("//Itemlist/Item"); //读取一级菜单数
    一级的下级
    或二级的上级或下级能给说说，怎么读<每一级>的代码吗？<?xml version="1.0" encoding="gb2312"?>
    <caidan>
      <item name="我是一个夹" type="folder">
         <item name="我是一个菜单" type="file">nnnnnn</item>
         <item name="我是一个菜单" type="file">nn</item>
         <item name="我是一个菜单" type="file">nnn</item>
         <item name="我是一个菜单" type="file">nnn</item>
         <item name="我是一个菜单" type="file">nnn</item>
         <item name="我是一个菜单" type="file">nnn</item>
         <item name="我是一个菜单" type="file">nnn</item>
         <item name="我是一个夹" type="folder">
            <item name="我是一个菜单" type="file">nnnn</item>
            <item name="我是一个菜单" type="file">nnn</item>
            <item name="我是一个菜单" type="file">nnn</item>
              <item name="我是一个夹" type="folder">
               <item name="我是一个菜单" type="file">nnn</item>
               <item name="我是一个菜单" type="file">nnn</item>
               <item name="我是一个菜单" type="file">nnn</item>
              </item>
         </item>
      </item>
      <item name="我是一个夹" type="folder">
         <item name="我是一个菜单" type="file">nnnnnn</item>
         <item name="我是一个菜单" type="file">nn</item>
         <item name="我是一个菜单" type="file">nnn</item>
         <item name="我是一个菜单" type="file">nnn</item>
         <item name="我是一个菜单" type="file">nnn</item>
         <item name="我是一个菜单" type="file">nnn</item>
         <item name="我是一个菜单" type="file">nnn</item>
         <item name="我是一个夹" type="folder">
            <item name="我是一个菜单" type="file">nnnn</item>
            <item name="我是一个菜单" type="file">nnn</item>
            <item name="我是一个菜单" type="file">nnn</item>
              <item name="我是一个夹" type="folder">
               <item name="我是一个菜单" type="file">nnn</item>
               <item name="我是一个菜单" type="file">nnn</item>
               <item name="我是一个菜单" type="file">nnn</item>
              </item>
         </item>
      </item>
    </caidan>