javascript - 使用 Javascript 对 XML 数据进行排序

Question

我需要一些关于 JavaScript 的帮助。我正在使用 XML，所以我需要在其上实现 JavaScript，并且我想对元素节点名称进行排序。请看下图，这将使您清楚我在说什么。我想要的是 JavaScript 代码而不是 Jquery。

Live Fiddle

<小时/>

UnSorted:                                   Sorted:

bookstore                                   bookstore
  xbook                                         abook
     title                                         author
     author                                        price
     year                                          title
     price                                         year
  cbook                                        cbook
  gbook                                        gbook
  abook                                        xbook    

<小时/>

function generate(node) {
    if (node.nodeType != 1) return "";
    var html = "<li>" + node.nodeName;
    var htmlForChildNodes = "";
    for (var i = 0; i < node.childNodes.length; i++) {
        htmlForChildNodes += generate(node.childNodes[i]);
    }
    if (htmlForChildNodes) {
        html += "<ul>" + htmlForChildNodes + "</ul>";
    }
    html += "</li>";
    return html;
}

<小时/>

谢谢

Answer 1

您应该解析 xml 文档并将其放入 JavaScript 对象数组中。这些很容易排序。

因此，您应该添加一个返回一个 parse(xmlDoc.documentElement) 函数，而不是调用 generate(xmlDoc.documentElement) 并让它直接从 xml 返回 html数组的数组。之后，更改您的generate()函数以获取带有children属性的对象，该对象是一个数组，而不是原始的xml dom。

解析应该看起来像这样:

function parse(node) {
    if (node.nodeType != 1) return null;
    var result = {name: node.nodeName};
    var children = [];
    for (var i = 0; i < node.childNodes.length; i++) {
        var child = parse(node.childNodes[i]);
        if (child)
        {
            children.push(child);
        }
    }
    result.children = children;
    return result;
}

现在您可以通过创建 your own comparator function 对具有子项的数组进行排序.

排序后，您调用(已更改的)generate() 函数，该函数将迭代对象/数组以生成 html。

Here is a fiddle 。我已将 generate() 函数的更改留给您。 (使用浏览器控制台检查生成的数据结构)