博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JS解析XML
阅读量:7238 次
发布时间:2019-06-29

本文共 2883 字,大约阅读时间需要 9 分钟。

XML文件:

<?xml version="1.0" encoding="gbk" ?>

<NewInfo>

<News>

 <Title>今天要下雨</Title>

 <Content>今天确实下雨了</Content>

 <Date>2009-02-04</Date>

</News>

<News>

 <Title>今天出太阳</Title>

 <Content>今天确实出太阳了</Content>

 <Date>2009-02-03</Date>

</News>

<News>

 <Title>今天很无聊</Title>

 <Content>今天确实很无聊</Content>

 <Date>2009-02-02</Date>

</News>

</NewInfo>

 

HTML文件:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">

<html xmlns="">

<head>

 <meta http-equiv="content-type" content="text/html; charset=gbk"/>

 <title>JS读取XMLDemo</title>

 

 <script language="javascript" type="text/javascript">

  function NewInfoAction()

  {

   var dom;

   var type=1;                                         //默认为IE浏览器

   var data = new Array();                             //存储实体的数组 

   if(navigator.userAgent.indexOf("MSIE")>0)

   {

    dom = new ActiveXObject("Microsoft.XMLDOM");    //实例化dom对象

    

    dom.async = false;                           

    dom.load("b.xml");                        //加载xml文件

    window.alert('IE');

   }

   else if(isFirefox=navigator.userAgent.indexOf("Firefox") > 0)

   {

    type=2;

    dom = document.implementation.createDocument("", "", null);         //火狐不支持ActiveXObject

    dom.async = false;

    dom.load("b.xml");

    

   }

   else

   {

    window.alert('暂不识别该浏览器!');

    return;

   }

   if(dom)

   {

    var node;

    if(type == 1)   //判断是否为IE浏览器

    {

     

     node = dom.documentElement.childNodes;      //这里的node大家可以理解为net中的表,方便大家理解

     for(var i=0;i<node.length;i++)

     {

      var title = node[i].childNodes[0].text;                 //取出i行中的字段的值,大家这样理解更方便

      var content = node[i].childNodes[1].text;

      var date = node[i].childNodes[2].text;

      window.alert(title);

         window.alert(content);

         window.alert(date);

      //data.push({title:title,content:content,date:date});     //在这里,我们使用使用json,把数据库存储在里面

     }

    }

    else

    {

     var node = dom.getElementsByTagName("News");

     for(var i=0;i<node.length;i++)

     {

                       window.alert(dom.getElementsByTagName("News")[i].childNodes[1].textContent);

                       window.alert(dom.getElementsByTagName("News")[i].childNodes[3].textContent);

                       window.alert(dom.getElementsByTagName("News")[i].childNodes[5].textContent);

      //var value = dom.getElementsByTagName("News")[i].textContent.split(' ');

      //var title = value[4];

      //var content = value[8];

      //var date = value[12];

      //data.push({title:title,content:content,date:date});     //在这里,我们使用使用json,把数据库存储在里面

     }

    }

   }

   else

   {

    window.alert("dom对象为空,失败了!");

    return;

   }

   if(data.length != 0)

   {

    var shtml = '';

    for(var i=0;i<data.length;i++)

    {

     

     shtml += '<div>';

     shtml += '<div style="float:left; background-color:Red; width:80px; height:15px">';

     shtml += data[i].title;

     shtml += '</div>';

     shtml += '<div>';

     shtml += '<div style="float:left; background-color:Green;width:150px; height:15px">';

     shtml += data[i].content;

     shtml += '</div>';

     shtml += '<div style="float:left; background-color:Green;width:120px; height:15px">';

     shtml += data[i].date;

     shtml += '</div>';

     shtml += '</div>';

     shtml += '</div>';

     shtml += '<br/>';

    }

    document.getElementById('textDiv').innerHTML = shtml;

   }

   else

   {

    document.getElementById('textDiv').innerHTML = '没有信息!';

   }

  }

 </script>

</head>

<body οnlοad="NewInfoAction()">

<div id="textDiv" >

</div>

</body>

</html>

转载地址:http://pugfm.baihongyu.com/

你可能感兴趣的文章
Mysql优化规范建议
查看>>
SPos共识机制:从去中心化到多中心思维改变
查看>>
集群和分布式区别
查看>>
Android Studio ADB Wifi 无线调试
查看>>
oppo9.0系统怎么不用ROOT激活XPOSED框架的教程
查看>>
MySQL----极客时间
查看>>
React Native for Android 环境配置
查看>>
聊聊Elasticsearch RestClient的NodeSelector
查看>>
编码、摘要和加密(二)——信息摘要
查看>>
Kotlin Android Extensions在Fragment中找不到控件的解决方法
查看>>
0322 - 响应 GitHub Webhooks 实现自动部署的 Web 服务
查看>>
命令行基础
查看>>
tensorflow生成tfrecord格式的数据
查看>>
Lamdba 表达式
查看>>
《Miss Talk》第02期:对话鲨鱼公园 赵文达
查看>>
Python 爬虫十六式 - 第八式:实例解析-全书网
查看>>
mpvue使用sass的解决方案
查看>>
横向滚动标题栏
查看>>
【二】express
查看>>
一文读懂 JAVA 异常处理
查看>>