[js读取xml数据兼容主流浏览器]js读取XML数据兼容主流浏览器

【www.bbyears.com--浏览器】

例1

<script type="text/javascript">
function loadXML(xmlFile) {
     var xmlDoc;
　　if (window.ActiveXObject){//兼容IE浏览器
　　xmlDoc = new ActiveXObject("Msxml2.DOMDocument");
　　xmlDoc.async=false;;//关闭异步加载，如许可确保在文档完整加载之前，解析器不会继续执行剧本
　　xmlDoc.load(xmlFile);//告知解析器加载名为 xmlfile 的文档
　　xmlDoc=xmlDoc.documentElement;//获取XML文档中的根元素
　　}
　　else if (document.implementation && document.implementation.createDocument){
　　xmlDoc=document.implementation.createDocument(""," ",null);//兼容火狐浏览器
　　xmlDoc.async=false;//关闭异步加载，如许可确保在文档完整加载之前，解析器不会继续执行剧本
　　xmlDoc.load(xmlFile);//告知解析器加载名为 xmlfile 的文档
　　xmlDoc=xmlDoc.documentElement;//获取XML文档中的根元素
　　}
　　else
　　{
　　xmlDoc=null;
　　}
　　}
    xmlDoc=loadXML("menuList.xml");
    var menus=xmlDoc.documentElement.getElementsByTagName("info");
    var htmlText="";
    for(i=0;i     {
        var category=menus[i].childNodes[0].text;
        var model=menus[i].childNodes[1].text;
        var mlink=menus[i].childNodes[2].text;
        htmlText+=""+category+"";
    }
    htmlText+="";
     document.getElementById("menulist").innerHTML+=htmlText;
    </script>

XML文件：

 
 Nokia/诺基亚
  3610A
  kk.html
 
 
  Samsung/三星
  3610A
  kk.html
 
 
  Lenovo/联想
  3610A
  kk.html
 
 
  BIRD/波导
  3610A
  kk.html
 
 
  Motorola/摩托罗拉
  3610A
  kk.html
 
 
  Coolpad/酷派
  3610A
  kk.html
 
 
  Gionee/金立
  3610A
  kk.html
 

例2

//note.xml

2008-08-08
George
John
Reminder
Don"t forget the meeting this weekend!

//readXml.htm

<script type="text/javascript">
var xmlDoc;
function clickHandler()
{
if (window.ActiveXObject)
{
   xmlDoc = new ActiveXObject("MSXML.DOMDocument");
   if(xmlDoc == null)
   {
    window.alert("MSXML.DOMDocument isn"t installed.");
   }
   else
   {
      xmlDoc.async=false;
      xmlDoc.load("note.xml");
         document.write(xmlDoc.getElementsByTagName("body")[0].firstChild.nodeValue);
   }
}
// code for Mozilla, Firefox, etc.
else if(document.implementation && document.implementation.createDocument)
{
   xmlDoc= document.implementation.createDocument("","",null)
   xmlDoc.load("note.xml");
   xmlDoc.onload=function()//anonymous function
        {
         document.write(xmlDoc.getElementsByTagName("body")[0].firstChild.nodeValue);
        }
}
}

</script>

nothing
hello, world.

例3

 代码如下

///////////////////////////////////////////////////////////
首先：xml文件（tree.xml）内容如下：



  山东省
  _blank
 
 
 
    威海市
    _blank
   
   
 
 
    烟台市
    _blank
   
   
   
      长夼村
      _blank
     
      http://www.111cn.net/
   
 
 
   富镇
   _blank
  
   http://www.111cn.net/
 
 

  河北省
  _blank
 
 
 
    泊头市
    _blank
   
   
   
      郊河
      _blank
     
      http://www.111cn.net/
   
 
 
    石家庄
    _blank
   
   
 

  浙江省
  _blank
 
 
 
    杭州市
    _blank
   
   
   
      某镇
      _blank
     
      http://www.111cn.net/
   
 
 
    温州市
    _blank
   
   
 
      某镇
      _blank
     
      http://www.111cn.net/
   
 


//////////////////////////////////////////////////////
然后：javascript函数实现：(文件名称：tree.htm）
<script Language="JavaScript">
var HTML = "";
var space = "";
var blank = "  ";
function getSubject()
{
    var xmlDoc;

    if(window.ActiveXObject)
    {
     //获得操作的xml文件的对象
        xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
        xmlDoc.async = false;
        xmlDoc.load("tree.xml");
        if(xmlDoc == null)
        {
          alert("您的浏览器不支持xml文件读取,于是本页面禁止您的操作,推荐使用IE5.0以上可以解决此问题!");
          window.location.href="/Index.aspx";
    return;
        }
    }
 //解析xml文件，判断是否出错
    if(xmlDoc.parseError.errorCode != 0)
    {
       alert(xmlDoc.parseError.reason);
       return;
    }
 //获得根接点
    var nodes = xmlDoc.documentElement.childNodes;
 //得到根接点下共有子接点个数，并循环
    for(var i=0; i     {
   //如果接点名为 tree
      if(nodes(i).nodeName == "tree")
      {
        readTree(nodes(i));
      }
   //如果接点名为 node
      else if(nodes(i).nodeName == "node")
      {
        readNode(nodes(i));
      }
    }
    //删除对象
    delete(xmlDoc);
    //显示HTML
    window.show.innerHTML = HTML;
    return;
}
//读Tree节点
function readTree(cI)
{
    var nodes = cI.childNodes;
    var menuHTML = space;
    menuHTML += blank;
 //得到超级链接
    menuHTML += "  //如果该节点的连接属性不为空，则连接
    if(cI.selectNodes("link")(0).text != "")
    {
       menuHTML += cI.selectNodes("link")(0).text;
    }
 //否则为空链接
    else
    {
       menuHTML += "#";
    }
 //目标
    if(cI.selectNodes("target")(0).text != "")
 {
       menuHTML += " target=""+cI.selectNodes("target")(0).text;
       menuHTML += """;
    }
 //点击菜单事件，调用divshow(vid)函数
    menuHTML += " onclick=javascript：divshow(""+cI.getAttribute("id")+"");";
 //得到节点标题
    menuHTML += " title="";
    menuHTML += cI.selectNodes("title")(0).text;
 //结束
    menuHTML += "">";
    //得到节点的正文
    menuHTML += cI.selectNodes("text")(0).text;
    menuHTML += "
n";
 //将menuHTML设置添加到HTML字符串
    HTML += menuHTML;
 //得到该节点的属性值     HTML += "n";
    for(var i=0; i     {
       var tempImg = "";
       tempImg += blank;
       if(nodes(i).nodeName == "tree")
       {
         space += tempImg;
         readTree(nodes(i));
         space = "";
       }
       else if(nodes(i).nodeName == "node")
       {
         space += tempImg;
         readNode(nodes(i));
       }
    }
    HTML += "n";
    return;
}
//读Node节点
function readNode(cI)
{
   var nodeHTML = space;
   nodeHTML += blank;
   //设置超级链接
   nodeHTML += "    //得到连接地址
   nodeHTML += cI.selectNodes("link")(0).text;
   //目标
   if(cI.selectNodes("target")(0).text != "")
      nodeHTML += "" target=""+cI.selectNodes("target")(0).text;
   //得到节点标题
   nodeHTML += "" title="";
   nodeHTML += cI.selectNodes("title")(0).text;
   //结束
   nodeHTML += "">";
   //得到节点的正文
   nodeHTML += cI.selectNodes("text")(0).text;
   nodeHTML += "
n";
   HTML += nodeHTML;
   //HTML += "";
   space = "";
   return;
}
//操作对象的显示还是隐藏效果
function divshow(vid)
{
  if(document.all[vid].style.display == "none")
  {
    document.all[vid].style.display = "block";
  }
  else
  {
    document.all[vid].style.display = "none";
  }
  return;
}
</script>

<script>
getSubject()
</script>

//////////////////////////////////////////////////////////
运行，要在同一个路径下！

本文来源：http://www.bbyears.com/bangongshuma/37837.html