Javascript 对从XML文件返回的数据进行排序

我有这个示例XML数据

<?xml version="1.0" encoding="ISO-8859-1"?>
<CATALOG>
    <CD>
        <TITLE>Empire Burlesque</TITLE>
        <ARTIST>Bob Dylan</ARTIST>
        <COUNTRY>USA</COUNTRY>
        <COMPANY>Columbia</COMPANY>
        <PRICE>10.90</PRICE>
        <YEAR>1985</YEAR>
    </CD>
    <CD>
        <TITLE>Hide your heart</TITLE>
        <ARTIST>Bonnie Tyler</ARTIST>
        <COUNTRY>UK</COUNTRY>
        <COMPANY>CBS Records</COMPANY>
        <PRICE>9.90</PRICE>
        <YEAR>1988</YEAR>
    </CD>
    <CD>
        <TITLE>Greatest Hits</TITLE>
        <ARTIST>Dolly Parton</ARTIST>
        <COUNTRY>USA</COUNTRY>
        <COMPANY>RCA</COMPANY>
        <PRICE>9.90</PRICE>
        <YEAR>1982</YEAR>
    </CD>
</CATALOG>

皇帝讽刺剧
鲍勃·迪伦
美国
哥伦比亚
10.90
1985
隐藏你的心
邦尼泰勒
英国
哥伦比亚唱片公司
9.90
1988
最成功的
多莉·帕顿
美国
RCA
9.90
1982

我希望在这次ajax调用之后的第二年按升序排序

function handleResponse () {
    "use strict";
    var ajax = new XMLHttpRequest();;

    if ( ajax ) {
        ajax.onreadystatechange = function () {

            if ( ajax.readyState == 4 ) {

                if ( ajax.status == 200 || ajax.status == 304 ) {

                    // console.log( ajax.responseXML );

                    var returnedData = handleXML( ajax.responseXML );

                    var collection = document.getElementById( "collection" );

                    collection.innerHTML = returnedData;

                }

            }

        };

        ajax.open("GET", "catalog.xml", true);
        ajax.send(null);
    }

}

function handleXML ( response ) {
    "use strict";

    var data = response;

    var cd = data.getElementsByTagName("CD");

    var table = "<table>";

        table += "<thead>";
        table += "<tr>";
        table += "<th>Title</th>";
        table += "<th>Artist</th>";
        table += "<th>Country</th>";
        table += "<th>Year</th>";
        table += "<th>Price</th>";
        table += "</tr>";
        table += "</thead>";
        table += "<tbody>";

        for ( var i = 0, len = cd.length; i < len; i++ ) {

            table += "<tr>";
            table += "<td>"+ cd[i].getElementsByTagName("TITLE")[0].firstChild.nodeValue +"</td>";
            table += "<td>"+ cd[i].getElementsByTagName("ARTIST")[0].firstChild.nodeValue +"</td>";
            table += "<td>"+ cd[i].getElementsByTagName("COUNTRY")[0].firstChild.nodeValue +"</td>";
            table += "<td>"+ cd[i].getElementsByTagName("YEAR")[0].firstChild.nodeValue +"</td>";
            table += "<td>$"+ cd[i].getElementsByTagName("PRICE")[0].firstChild.nodeValue +"</td>";
            table += "</tr>";

        }

        table += "</tbody>";
        table += "</table>";

    return table;
}

window.onload = function() {  
    "use strict";
    var button = document.getElementById("button");
    button.onclick = handleResponse;
};

函数句柄响应（）{
“严格使用”；
var ajax=new-XMLHttpRequest（）；；
if（ajax）{
ajax.onreadystatechange=函数（）{
if（ajax.readyState==4）{
if（ajax.status==200 | | ajax.status==304）{
//log（ajax.responseXML）；
var returnedData=handleXML（ajax.responseXML）；
var collection=document.getElementById（“collection”）；
collection.innerHTML=返回的数据；
}
}
};
open（“GET”，“catalog.xml”，true）；
send（null）；
}
}
函数handleXML（响应）{
“严格使用”；
var数据=响应；
var cd=data.getElementsByTagName（“cd”）；
var表=”；
表+=”；
表+=”；
表+=“标题”；
表+=“艺术家”；
表+=“国家”；
表+=“年”；
表+=“价格”；
表+=”；
表+=”；
表+=”；
对于（变量i=0，len=cd.length；i

因此，当数据出现在浏览器中时，它首先从显示1982年、1985年和1988年记录的数据行开始

---

如何解决此问题？

您可以通过将

cd

转换为数组并使用数组的排序功能对其进行排序来实现。因此您的

handleXML

功能将是：

function handleXML ( response ) {
    "use strict";

    var data = response;

    var cd = data.getElementsByTagName("CD");

    var table = "<table>";

        table += "<thead>";
        table += "<tr>";
        table += "<th>Title</th>";
        table += "<th>Artist</th>";
        table += "<th>Country</th>";
        table += "<th>Year</th>";
        table += "<th>Price</th>";
        table += "</tr>";
        table += "</thead>";
        table += "<tbody>";
        function s(a,b){
        return parseInt(a.getElementsByTagName("YEAR")[0].firstChild.nodeValue,10) - parseInt(b.getElementsByTagName("YEAR")[0].firstChild.nodeValue,10);
        }
        var sortedCD = Array.prototype.slice.call(cd);// convert XML object to array
        sortedCD=sortedCD.sort(s);//sort it using element's year
        for ( var i = 0, len = sortedCD.length; i < len; i++ ) {

            table += "<tr>";
            table += "<td>"+ sortedCD[i].getElementsByTagName("TITLE")[0].firstChild.nodeValue +"</td>";
            table += "<td>"+ sortedCD[i].getElementsByTagName("ARTIST")[0].firstChild.nodeValue +"</td>";
            table += "<td>"+ sortedCD[i].getElementsByTagName("COUNTRY")[0].firstChild.nodeValue +"</td>";
            table += "<td>"+ sortedCD[i].getElementsByTagName("YEAR")[0].firstChild.nodeValue +"</td>";
            table += "<td>$"+ sortedCD[i].getElementsByTagName("PRICE")[0].firstChild.nodeValue +"</td>";
            table += "</tr>";

        }

        table += "</tbody>";
        table += "</table>";

    return table;
}

函数handleXML（响应）{
“严格使用”；
var数据=响应；
var cd=data.getElementsByTagName（“cd”）；
var表=”；
表+=”；
表+=”；
表+=“标题”；
表+=“艺术家”；
表+=“国家”；
表+=“年”；
表+=“价格”；
表+=”；
表+=”；
表+=”；
函数s（a，b）{
返回parseInt（a.getElementsByTagName（“年”）[0].firstChild.nodeValue，10）-parseInt（b.getElementsByTagName（“年”）[0].firstChild.nodeValue，10）；
}
var sortedCD=Array.prototype.slice.call（cd）；//将XML对象转换为数组
sortedCD=sortedCD.sort（s）；//使用元素的年份对其进行排序
对于（变量i=0，len=sortedCD.length；i

将XML解析与输出分开。换句话说，解析JS数组中的数据，对其排序，然后进行输出。这有助于详细说明，请@Sirko，如果使用一些代码。感谢您在

的
handleXML（）循环中遍历所有数据。不要把它们全部放在一个字符串中，而是将它们收集到一个数组中，每个条目有一个对象。然后使用对数组的
sort（）
函数的自定义回调，以您需要的方式对其进行排序。最后遍历该数组并进行输出。我不会为你编码的。我认为，到目前为止，您已经拥有了所需的所有信息。您可以通过json而不是xml获得数据。这将使您的任务更轻松。请参阅下面的链接，希望这有助于[对Xml数据排序][1][1]：