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

前端之家收集整理的这篇文章主要介绍了如何在JavaScript中重新排序/排序NodeList?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我认为应该是一个直截了当的问题;让我快速解释一下:

在我的JavaScript中,food.xml被读入:

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

所以现在我有一个带有所有食物元素的NodeList xmlFoodList.到目前为止很棒.问题是我想基于元素< category>对节点进行排序.内.我可以读到:

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

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

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

解决方法

如果先将它们转换为数组,则可以对NodeList的元素进行排序:
  1. var foods = xmlDoc.getElementsByTagName("food");
  2. var foodsArray = Array.prototype.slice.call(foods,0);

然后你可以使用sort方法

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

这在很大程度上取决于您的XML模式 – 例如,如果您的食物属于多个类别,那么它们只能按照上面代码中的第一个类别进行排序.

猜你在找的JavaScript相关文章