zoukankan      html  css  js  c++  java
  • JS读取XML数据

        最近在项目中由于考虑到访问性能的问题,已经对内页等做生成静态处理了,但是里面有些内容又是需要动态的,按照以前的方式,应该是会用JS的调用一个动态的脚本文件,前端时间看了下红孩子,好像里面有些代码蛮不错的,都是JS调用XML数据的,XML可以直接用动态脚本程序去生成,呵呵,不错的东西简单的研究了下,直接拿过来就可以使用了。

    XMl数据格式如下:

    <?xml version="1.0" encoding="gb2312"?>
    <root>
    <item>
    <name>刘亦菲</name>
    <url>MingXing/LiuYiFei.htm</url>
    <color>7A9D4B</color>
    </item>
    <item>
    <name>蔡依林</name>
    <url>MingXing/CaiYiLin.htm</url>
    <color>FD0000</color>
    </item>
    <item>
    <name>张娜拉</name>
    <url>MingXing/ZhangNaLa.htm</url>
    <color>7A9D4B</color>
    </item>
    <item>
    <name>张韶涵</name>
    <url>MingXiang/ZhangShaoHan.htm</url>
    <color>0000FF</color>
    </item>
    <item>
    <name>张靓颖</name>
    <url>MingXing/ZhangLiangYin.htm</url>
    <color>7A9D4B</color>
    </item>
    <item>
    <name>李宇春</name>
    <url>MingXing/LiYuChun.htm</url>
    <color>7A9D4B</color>
    </item>
    <item>
    <name>徐若瑄</name>
    <url>MingXing/XuLuXuan.htm</url>
    <color>FD0000</color>
    </item>
    </root>

    前端JS脚本代码如下:
    //获取网站热门点击排行

    var cdsales=new ActiveXObject("Microsoft.XMLDOM"); //创建XmlDom对象
    cdsales.async=true//使用异步加载
    cdsales.onreadystatechange=LoadedSales;
    function LoadedSales()
    {
        var txt
    ="";
        
    if(cdsales.readyState==4)
        
    {
            
    if(cdsales.parseError.errorCode != 0
            
    {
                txt
    ="";
            }
    else{
                var bi
    =cdsales.documentElement.selectNodes("item");
                
    if(bi!=null&&bi.length>0)
                
    {
                    
    for(var i=0;i<bi.length;i++)
                    
    {    
                        txt
    +="<li>·<a href="+bi[i].childNodes[1].text+" style=color:"+bi[i].childNodes[2].text+">"+bi[i].childNodes[0].text+"</a></li>";
                    }

                }
    else{
                    txt
    ="";
                }

            }

        }
    else{
            txt
    ="";
        }
        
        sales.innerHTML
    =txt;
    }

    function LoadSalesDoc()
    {
        var Url
    ="/XML/Hot.xml";
        cdsales.load(Url);
    }

    上面的Hot.Xml可以使用程序去自动生成,只要输出来的页面为Xml的格式就可以了。好像现在越来越多的网站已经开始使用DIV+JS+XML的方式去架构,呵呵,这里先学习下代码效果还是比较不错的,至少静态页面也可以动态的去读取数据库了,不知道这个是不是Ajax的概念,应该算是吧。

  • 相关阅读:
    vue改变了数据却没有自动刷新
    Unable to find vcvarsall.bat
    修改Linux用户配置之后先验证再退出
    平面最远点对
    [转]你可能不知道的五个强大HTML5 API
    sqlite3常用技巧
    使用rsync
    画图必备numpy函数
    np.percentile获取中位数、百分位数
    [转]numpy 100道练习题
  • 原文地址:https://www.cnblogs.com/Apollo/p/717216.html
Copyright © 2011-2022 走看看