Javascript 如何按数据属性的数值对元素进行排序？

我有多个属性为：

数据百分比

的元素，是否有一种方法可以先使用JavaScript或jQuery将元素按升序排序，并使用最小值

HTML:

预期结果：

使用：

这是小提琴：

---

如果使用IE<10，则不能使用

dataset

属性。改用

getAttribute

：

var $wrapper = $('.testWrapper');

$wrapper.find('.test').sort(function(a, b) {
    return +a.getAttribute('data-percentage') - +b.getAttribute('data-percentage');
})
.appendTo($wrapper);

---

这里是重点：

我认为Tinysort Jquery插件应该是一个选项，您可以在这里获得它：

我没有尝试过，但代码应该如下所示：

$("#test > div").tsort("",{attr:"data-percentage"});

---

希望这将有助于

一个更健壮的选项，此函数可以允许您根据多个选项对元素进行排序

$('.testWrapper').find('.test').sort(function (a, b) {
   return $(a).attr('data-percentage') - $(b).attr('data-percentage');
})
.appendTo('.testWrapper');

---

出于某种原因，在Firefox64.0.2上，没有一个答案适合我。这是约瑟夫·西尔伯（Joseph Silber）和杰夫·吉尔伯特（Jeaf Gilbert）最后的答案：

var $wrapper = $('.testWrapper');

$wrapper.find('.test').sort(function(a, b) {
    return +$(a).data('percentage') - +$(b).data('percentage');
})
.appendTo($wrapper);

---

在这些div周围有一个包装div吗？是的，有-我已经更新了问题以反映。没有必要使用第一个空字符串参数。只需将对象作为其唯一参数传递给它。这里不需要一元加号，因为

-

会将两个操作数转换为数字。“这让事情更清楚了，”费利克斯克林-我讨厌含蓄的演员阵容。如果我在做数学，我喜欢直接处理数字friend@LukeOliff-有时。在这种情况下，它是不需要的，所以我不希望它的开销。@JosephSilber做得好，做得好！我有一个问题，如果div没有“数据百分比”，我想排在最后，这可能吗？谢谢。吉尔伯我有一个问题，如果div没有“数据百分比”，我想排在最后，这可能吗？谢谢

// This calls the function
DOYPSort('#wrapper', '.element', value, order);

    // Parameters must be strings
    // Order of must be either 'H' (Highest) or 'L' (Lowest)
    function DOYPSort(wrapper, elementtosort, AttrToSort, orderof) {
        $(wrapper).find(elementtosort).sort(function (a, b) {
            if (orderof === 'H') {
                return +b.getAttribute(AttrToSort) - +a.getAttribute(AttrToSort);
            } 
            if (orderof === 'L') {
                return +a.getAttribute(AttrToSort) - +b.getAttribute(AttrToSort);
            }
        }).appendTo(wrapper);
    }

var $wrapper = $('.testWrapper');

$wrapper.find('.test').sort(function(a, b) {
    return +$(a).data('percentage') - +$(b).data('percentage');
})
.appendTo($wrapper);