Javascript 追加列表项后刷新已排序列表的顺序

我试图使用

ol

来显示几个动态列表项。在

使用jQuery添加了一个列表项之后，我希望浏览器能够刷新有序列表，但是看起来并不是这样

<ol>
    <li value="1">First</li>
    <li value="2">Second</li>
    <li value="4">Forth</li>
</ol>


首先
秒
第四

添加第三个后，生成的顺序为：

// First
// Second
// Forth
// Third <-

//首先
//第二
//四
//第三首先，请注意，
value
不是
li
的有效属性，因此您的代码无效。对于您需要的任何非标准属性，您都应该使用
data
属性，您需要编写一个sorter函数。试试这个：

$('#addThird').one('click', function() {
   $('ol').append('<li data-value="3">Third</li>');
    sortItems();
});

var sortItems = function() {
    var $items = $('ol li');
    $items.sort(function(a, b) {
        var keyA = $(a).data('value');
        var keyB = $(b).data('value');
        return (keyA > keyB) ? 1 : 0;
    });
    $.each($items, function(index, row){
        $('ol').append(row);
    });
}    

$（'addThird'）.one（'click'，function（）{
$（'ol'）.append（'li data value=“3”>Third）；
sortItems（）；
});
var sortItems=函数（）{
变量$items=$（'ol li'）；
$items.sort（函数（a，b）{
var keyA=$（a）.data（'value'）；
var-keyB=$（b）.data（'value'）；
返回（keyA>keyB）？1:0；
});
$。每个（$项，函数（索引，行）{
$（'ol'）。追加（行）；
});
}    


这是根据元素的
数据值
属性进行排序的，但是可以根据需要进行修改。
我认为浏览器从来没有订购过列表——请参阅。不过，您可以使用。请看——老实说，在添加项目后，您自己触发排序会更容易。