Exemple de partage de code pour JS lisant des données XML

Récemment, dans le projet, en raison du problème de performances d'accès, les pages internes ont été générées statiquement, mais certains contenus doivent être dynamiques. Selon la méthode précédente, il doit être utilisé <.>JS pour appeler un fichier de script dynamique. J'ai regardé Redbaby pendant le front-end. Il semble que certains des codes qu'il contient soient assez bons. Ils appellent tous des données XML. . XML peut être utilisé directement. Programme de script dynamique pour générer, haha, c'est une bonne chose, je l'ai simplement étudié, je l'ai pris et je l'ai utilisé.

Le format des données XML est le suivant :

<?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>

Le code du script JS front-end est le suivant :

//Obtenez le classement par clic chaud du site Web

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 ci-dessus Vous pouvez utiliser un programme pour le générer automatiquement, à condition que la page de sortie soit au format Xml. Il semble que de plus en plus de sites Web aient commencé à utiliser p+JS+XML pour

architecture Haha, c'est plutôt bien d'apprendre le code en premier. Au moins les pages statiques peuvent également être lues dynamiquement. Je ne sais pas si c'est le concept de l'Ajax, il faut le considérer comme tel.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!