属性値に基づいてdivをソートdiv（降順）

Question

私はサーバーから実際にこのmessage_countデータを3分ごとに引き出し、それに応じて各プレーヤーの属性を更新するajax関数を持っています...今、divを自動的に取得したいmessage_count属性値に基づいてこのAjaxコールのあとにソートされます。メッセージが多い方は最初のdivになります。簡単

var players = $(".players div"); 
 
var temp = players.sort(function(a,b){ 
 
    return parseInt($(b).attr("message_count")) - parseInt($(a).attr("message_count")); 
 
}); 
 
$(".players").html(temp);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="players"> 
 
    <div class="player" message_count="8">Div 8</div> 
 
    <div class="player" message_count="2">Div 2</div> 
 
    <div class="player" message_count="0">Div 0</div> 
 
    <div class="player" message_count="1">Div 1</div> 
 
</div>

Answer 1

クエリを逆順にするだけです。

.sort(function(a, b){return b.getAttribute('message_count') - a.getAttribute('message_count')) 

var sortedDivs = jQuery(".players").find(".player").toArray().sort(function(a, b){return parseInt(b.getAttribute('message_count')) - parseInt(a.getAttribute('message_count'))}); 
 

 
jQuery.each(sortedDivs, function(index, value) { 
 
    jQuery(".players").append(value); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="players"> 
 
    <div class="player" message_count="8">8</div> 
 
    <div class="player" message_count="2">2</div> 
 
    <div class="player" message_count="0">0</div> 
 
    <div class="player" message_count="1">1</div> 
 
</div>

Answer 2

$('div').sort(function (a, b) { 

     var contentA =parseInt($(a).attr('message_count')); 
     var contentB =parseInt($(b).attr('message_count')); 
     return (contentA < contentB) ? -1 : (contentA > contentB) ? 1 : 0; 
    }) 

Answer 3

あなたはjavascriptのsort()メソッドを使用することができますがそれを行いますjqueryの.sortを使用して

var sortedDivs = jQuery(".players").find(".player").toArray().reverse(sorter); 
 
jQuery.each(sortedDivs, function(index, value) { 
 
    jQuery(".players").append(value); 
 
}); 
 

 
function sorter(a, b) { 
 
    return a.getAttribute('message_count') - b.getAttribute('message_count'); 
 
};

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="players"> 
 
    <div class="player" message_count="8">8</div> 
 
    <div class="player" message_count="2">2</div> 
 
    <div class="player" message_count="0">0</div> 
 
    <div class="player" message_count="1">1</div> 
 
</div>