如何在 JavaScript 中对 NodeList 重新排序/排序?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/4760080/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 14:47:46  来源:igfitidea点击:

How can I reorder/sort a NodeList in JavaScript?

javascriptsortingnodelist

提问by Chris DeHaan

I have what I think should be a straightforward question; let me quickly explain:

我有一个我认为应该是一个直截了当的问题;让我快速解释一下:

In my JavaScript, food.xmlis read in with:

在我的 JavaScript 中,food.xml读取的是:

getMenuXml.open("GET","food.xml",false);
getMenuXml.send();
xmlDoc=getMenuXml.responseXML;
xmlFoodList = xmlDoc.getElementsByTagName("food");

so that now I have a NodeList xmlFoodListwith all the food elements. Great so far. The problem is I want to sort the nodes based on an element <category>inside. I can read that with:

所以现在我有一个xmlFoodList包含所有食物元素的 NodeList 。到目前为止很棒。问题是我想根据<category>里面的元素对节点进行排序。我可以阅读:

xmlFoodList[i].getElementsByTagName("category")[0].childNodes[0].nodeValue

Later in my code, the food items are displayed in a list, and as you'd expect, I want food of the same category to be listed together. So, my question is: How can I reorder the nodes in xmlFoodListbased on their category?

在我的代码后面,食物项目显示在一个列表中,正如您所期望的,我希望将同一类别的食物一起列出。所以,我的问题是:如何xmlFoodList根据类别对节点重新排序?

Notes: I can't change food.xmlcoming in, and I don't want to edit my later code to do the sorting as the list is populated. I don't want to convert the NodeList to an array, since I'd have to rewrite a lot of later code. Performance isn't actually much of a concern, so feel free to clone/nested loop all you want. Thanks for your time.

注意:我无法更改food.xml进入,并且我不想编辑我以后的代码来在填充列表时进行排序。我不想将 NodeList 转换为数组,因为我必须重写很多以后的代码。性能实际上并不是什么大问题,所以你可以随意克隆/嵌套循环。谢谢你的时间。

回答by andrewmu

You can order the elements of the NodeList, if you convert them to an array first:

如果先将它们转换为数组,则可以对 NodeList 的元素进行排序:

var foods = xmlDoc.getElementsByTagName("food");
var foodsArray = Array.prototype.slice.call(foods, 0);

Then you can use the sortmethod:

然后你可以使用这个sort方法:

foodsArray.sort(function(a,b) {
    var aCat = a.getElementsByTagName("category")[0].childNodes[0].nodeValue;
    var bCat = b.getElementsByTagName("category")[0].childNodes[0].nodeValue;
    if (aCat > bCat) return 1;
    if (aCat < bCat) return -1;
    return 0;
});

This is highly dependent on your XML schema though - if, for example, you had foods which were in more than one category they would only be sorted by the first category in the code above.

不过,这高度依赖于您的 XML 模式 - 例如,如果您有多个类别的食物,它们将仅按上述代码中的第一个类别进行排序。

回答by Ravikiran

It's a good idea to use a Javascript library to get ready-made functions w.r.t Node List operations such as re-ordering, sorting, foreach etc. I would recommend YUI-3, please refer YUI-3 NodeList.

最好使用 Javascript 库来获得现成的函数,例如重新排序、排序、foreach 等节点列表操作。我推荐 YUI-3,请参考YUI-3 NodeList

回答by Chris B. Behrens

Take a look at this: Xml, xsl Javascript sorting. Worst case scenario, you transform the data into precisely the same xml, but sorted. As long as you're paying the transformation penalty, you might consider transforming it into a form more useful for whatever the next step is.

看看这个:Xml, xsl Javascript 排序。最坏的情况是,您将数据转换为完全相同的 xml,但已排序。只要您支付转换惩罚,您就可以考虑将其转换为对下一步更有用的形式。