如果数据不是有序的,如何对数组中的json数据进行排序?

var data = [ { cid: "59eb15be", parentCid: "", lv: 1, number: "2", subject: "Title 2" }, { cid: "d7d851ef", parentCid: "", lv: 1, number: "4", subject: "Title4" }, { cid: "bd01cc50", parentCid: "ae35e67d", lv: 2, number: "1.1", subject: "Title1.1" }, { cid: "2d8bd8b0", parentCid: "", lv: 1, number: "3", subject: "Title3" }, { cid: "7f66a92d", parentCid: "ae35e67d", lv: 2, number: "1.2", subject: "Title1.2" }, { cid: "ae35e67d", parentCid: "", lv: 1, number: "1", subject: "Title1" }, { cid: "e7c2dbcc", parentCid: "ae35e67d", lv: 2, number: "1.3", subject: "Title1.3" }, { cid: "cc784c42", parentCid: "ae35e67d", lv: 2, number: "1.4", subject: "Title1.4" } ]; var chapterListDiv = document.getElementById("listSummary"); var store = document.createDocumentFragment(); //we use this to store temporary orphaned childs for(var i=0; i<data.length; i++){ var node = document.createElement("div"); node.className = "lv" + (data[i].level || data[i].lv); var content = document.createTextNode(data[i].number + "." + " " + data[i].subject); node.appendChild(content); node.setAttribute("data-id", data[i].cid); //set a data-id attribute. We need it for the orphaned values. node.setAttribute("data-parent-id", data[i].parentCid); //set a data-parent-id attribute. We need it for the orphaned values. if (data[i].parentCid == "") //we have a root node { chapterListDiv.appendChild(node); } else { var parent = chapterListDiv.querySelector('div[data-id="'+data[i].parentCid+'"]'); //look for a node with the parent id. if (parent) //parent is found { parent.appendChild(node); } else { store.appendChild(node); //temp store the node. } } } //final check var storeChilds = store.querySelectorAll('div[data-parent-id]'); if (storeChilds) { Array.prototype.map.call(storeChilds, function(element){ var parent = document.querySelector('div[data-id="'+element.getAttribute("data-parent-id")+'"]') || store.querySelector('div[data-id="'+element.getAttribute("data-parent-id")+'"]') parent.appendChild(element); }); } 
 .lv1 { } .lv2{ padding-left: 30px; } .lv3{ padding-left: 30px; } 
 

在json数据中,所有项目都有一个“cid”,其中一些有“parentCid”,这意味着它是它的子级别。)

作为第二级结果

 1.3. Title1.3 1.4. Title1.4 1.1. Title1.1 1.2. Title1.2 

这不是顺序,因为“1.1”和“1.2”在循环访问时找不到它们的父节点,因为它们的父节点在它们后面。 这就是为什么“1.3”和“1.4”首先被追加(父节点在前面)的原因。

有没有什么方法可以像第二级一样正确地得到结果?

 1.1. Title1.1 1.2. Title1.2 1.3. Title1.3 1.4. Title1.4 

只需在处理之前对数据进行排序

 data.sort(function(a, b) { if ((a.lv | a.level) > (b.lv | b.level)) return 1; else if ((a.lv | a.level) < (b.lv | b.level)) return -1; else { if (Number(a.number) > Number(b.number)) return 1; else return -1; } }); 

| a.level | a.level是因为你的一个数据点有level而不是lv

要按层次结构按编号订购数据,只需使用sort函数:

 data.sort(function(a, b) { return a.number > b.number }); 

如果保留此元素编号样式,则只需按此属性进行排序即可

我建议阅读https://stackoverflow.com/a/979325/4772988

删除父元素。 然后通过将字符串数转换为浮点数并将它们相互减去来对第二级元素进行排序。

 var data_sorted = data.filter(function(value, index){ return value.parentCid != ""; }).sort(function(value1, value2){ return parseFloat(value1.number) - parseFloat(value2.number); }); 

演示

使用Array.filter()Array.sort()Array.forEach()解决方案:

 var data = [{ cid: "59eb15be", parentCid: "", lv: 1, number: "2", subject: "Title 2" }, { cid: "d7d851ef", parentCid: "", lv: 1, number: "4", subject: "Title4" }, { cid: "bd01cc50", parentCid: "ae35e67d", lv: 2, number: "1.1", subject: "Title1.1" }, { cid: "2d8bd8b0", parentCid: "", lv: 1, number: "3", subject: "Title3" }, { cid: "7f66a92d", parentCid: "ae35e67d", lv: 2, number: "1.2", subject: "Title1.2" }, { cid: "ae35e67d", parentCid: "", lv: 1, number: "1", subject: "Title1" }, { cid: "e7c2dbcc", parentCid: "ae35e67d", lv: 2, number: "1.3", subject: "Title1.3" }, { cid: "cc784c42", parentCid: "ae35e67d", lv: 2, number: "1.4", subject: "Title1.4" }]; // this is the place for your tree generating function function print(a, l) { var ll = l; while (ll--) document.write(' '); document.write('Computed level: ' + l + ' '); Object.keys(a).forEach(function (i) { document.write(i + ': ' + a[i] + ' '); }); document.write('\n') } function getChildren(parent, level) { data.filter(function (a) { return a.parentCid === parent; }).sort(function (a, b) { return a.number.localeCompare(b.number); }).forEach(function (a) { print(a, level); getChildren(a.cid, level + 1); }); } document.write('
'); getChildren('', 0); document.write('

');