zoukankan      html  css  js  c++  java
  • js加载XML文件

    // XML文件
    <?xml version="1.0" encoding="gb2312"?>
    <root>
      <father name="菜单一">
        <Child url="right.html" enable="false">子项1</Child>
        <Child url="right.html" enable="false">子项2</Child>
        <Child url="right.html" enable="false">子项3</Child>
         
      </father>
      <father name="菜单二">
        <Child url="right.html" enable="false">子项3</Child>
        <Child url="right.html" enable="false">子项4</Child>
      </father>
    
    </root>
    
    // js 文件
    <!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>无标题文档</title>
    <link href="css/style.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" language="JavaScript" src="js/jquery.js"></script>
    
    <script type="text/javascript">
    $(function(){	
    	//导航切换
    	$(".menuson li").click(function(){
    		$(".menuson li.active").removeClass("active")
    		$(this).addClass("active");
    	});
    	
    	$('.title').click(function(){
    		var $ul = $(this).next('ul');
    		$('dd').find('ul').slideUp();
    		if($ul.is(':visible')){
    			$(this).next('ul').slideUp();
    		}else{
    			$(this).next('ul').slideDown();
    		}
    	});
    })	
    </script>
     
    </head>
    
    <body  style="background:#f0f9fd;">
    	<div class="lefttop"><span></span>菜 单</div>
        
        <dl id="leftmenu" class="leftmenu">
          <SCRIPT>
              var xmlDom = null;
              if (window.ActiveXObject) {
                  alert("aa");
                  xmlDom = new ActiveXObject("Microsoft.XMLDOM");
                  //xmlDom.loadXML(xmlFile);//如果用的是XML字符串  
                  xmlDom.load(LeftXML.xml); //如果用的是xml文件。  
              } else if (document.implementation && document.implementation.createDocument) {
                  var xmlhttp = new window.XMLHttpRequest();
                  xmlhttp.open("GET", "LeftXML.xml", false);
                  xmlhttp.send(null);
                  xmlDom = xmlhttp.responseXML.documentElement;//一定要有根节点(否则google浏览器读取不了)  
              } else {
                  xmlDom = null;
              }
    
              var finallyArray="";
              for (var i = 0; i < xmlDom.getElementsByTagName("father").length; i++) {
                  
                  var menuString = xmlDom.getElementsByTagName("father")[i].attributes[0].value;
    
                  finallyArray += "<dd><div class='title'><span><img src='images/leftico02.png' /></span>" + menuString + "</div><ul class='menuson'>";
                  
                  for (var j = 0; j < xmlDom.getElementsByTagName("father")[i].getElementsByTagName("Child").length; j++) {       
                      var _childfirst = xmlDom.getElementsByTagName("father")[i].getElementsByTagName("Child")[j].textContent;
                      var _childsecond = xmlDom.getElementsByTagName("father")[i].getElementsByTagName("Child")[j].attributes[0].value;
                      var _childsecond = xmlDom.getElementsByTagName("father")[i].getElementsByTagName("Child")[j].attributes[1].value;
    
                      finallyArray = finallyArray + "<li><cite></cite><a href=" + _childsecond + " target='rightFrame'>" + _childfirst + "</a><i></i></li>";
                  }
                  finallyArray += "</ul></dd>";
              }
              document.getElementById("leftmenu").innerHTML = finallyArray;         
          </SCRIPT>
        </dl>
    </body>
    </html>
    

      

  • 相关阅读:
    《精通CSS:高级Web标准解决方案》系列(02):可视化格式模型
    《C#入门经典(第5版)》系列(10):定义类成员
    《C#入门经典(第5版)》系列(11):集合、比较和转换
    《锋利的jQuery》系列(01):jQuery选择器
    《C#入门经典(第5版)》系列(09):定义类
    C# 通过搜狐微博api远程更换壁纸
    C# 联网五子棋
    C# 新浪微博群发器
    C# seo测试小工具1:同时更新多网站的博客(csdn,cnblogs,163,sina)
    MS Ajax 客户端编程 学习笔记 (3)
  • 原文地址:https://www.cnblogs.com/IamJiangXiaoKun/p/4792837.html
Copyright © 2011-2022 走看看