jQueryオブジェクトにいくつかのDOM要素があるかどうかを確認する最速の方法

Question

いくつかのDOM要素を持つjQueryオブジェクトがあります。私はこのオブジェクトを取り、その要素を並べ替えます。しかし、いくつかの要素が優先されるので、並べ替えたときに優先順位のない要素の下に置くことはできません。

例：

<!-- original list --> 
<el id='2' /> <!-- has priority --> 
<el id='0' /> <!-- has priority --> 
<el id='3' /> <!-- has priority --> 
<el id='1' /> <!-- no priority --> 
<el id='4' /> <!-- no priority --> 

<!-- wrong way to sort --> 
<el id='0' /> <!-- has priority --> 
<el id='1' /> <!-- no priority --> 
<el id='2' /> <!-- has priority --> 
<el id='3' /> <!-- has priority --> 
<el id='4' /> <!-- no priority --> 

<!-- right way to sort --> 
<el id='0' /> <!-- has priority --> 
<el id='2' /> <!-- has priority --> 
<el id='3' /> <!-- has priority --> 
<el id='1' /> <!-- no priority --> 
<el id='4' /> <!-- no priority --> 

すると、私はこれを解決しています方法：

var elements = $(selector); 
elements.sort(sort_by_id); 
var priority_elements = get_prio_elements(); //That's the only way to know which are the elements with priority 
var temp = $(); 
elements.each(function(){ 
    if(priority_elements.is(this)) //check if element are inside priority list 
     temp = temp.add($(this)); //push element in elements object order 
}); 
set_prio_elements(temp); 

私の出力はtempオブジェクトでなければなりません。つまり、tempには、以下が含まれている必要があります。

<el id='0' /> <!-- has priority --> 
<el id='2' /> <!-- has priority --> 
<el id='3' /> <!-- has priority --> 

問題は、このコードが大規模なリスト（300+以上）に対して非常に遅いことです。私はこれをどのように改善することができるか知りたい。

A link at fiddle that could help understand.

Answer 1

あなたのsort_functionで要素の 'priority'属性が 'true'に設定されているかどうかチェックすることはできませんか？

まず、すべての要素を2つの配列に集めます：1つはpriority = 'true'、もう1つは反対の配列をソートして連結します。

---

UPDATE： 私はこのバイオリンを作成し、あなたが を好きなら、それを適応させる。そして、それはより多くのリソースが効率的ですかどうかを見ることができるかどうか、参照してください。
「要素」のオブジェクト全体を再び通過する必要がないので、私はそれを推測していますが、間違っている可能性があります。

変更内容

https://jsfiddle.net/virginieLGB/qev5r9yx/

：
1）私たちは、両方のオブジェクトに

elements.sort(sort_by_id); 
priority_elements.sort(sort_by_id); 

2を並べ替える）私達はちょうど

for(var i = elements.length - 1 ; i >= 0 ; i--) { 
    var index = priority_elements.indexOf(elements[ i ]); 
    if(index > -1) { 
     var temp = elements[ i ]; 
     elements.splice(i , 1); 
     elements.unshift(temp); 
     priority_elements.splice(index , 1); 
    } 
    } 

---

をunshifting、それらを削除することにより、起動時にバック優先要素を配置

更新＃2：

私の出力はtempオブジェクトでなければなりません。私は意味：tempが含まれている必要があります。その後、<el id='2' /> <!-- has priority -->
<el id='3' /> <!-- has priority -->

まあ
<el id='0' /> <!-- has priority -->
、なぜあなただ​​け

priority_elements.sort(sort_by_id); 

をしませんか？
基本的に、あなたがやっているように見えるのは、優先順位の要素を取得してから、優先順位がある場合は元のリストにチェックインしてください。 ？または私は何かを逃していますか？

Answer 2

あなたはいくつかの重要な機能を逃しているように見えるように、それはあなたのJSコードが実際にやっていることを理解することは難しいです。

あなたの希望する出力は、最初に要素をpriorityで並べ替え、次にidで並べ替えることです。これは単一のsort()コールで行うことができます。

最初に、独自の属性を作成することは無効であるため、priorityはdata-priorityである必要があります。そこからは、このような何か独自のsort()ロジックを実装することができます

$(selector).sort(function(a, b) { 
    var $a = $(a), 
     $b = $(b), 
     aId = parseInt(a.id, 10), 
     bId = parseInt(b.id, 10); 

    // sort by priority 
    if ($a.data('priority') && !$b.data('priority')) 
     return -1; 
    else if (!$a.data('priority') && $b.data('priority')) 
     return 1; 

    // sort by id 
    if (aId < bId) 
     return -1; 
    else if (aId > bId) 
     return 1 

    return 0; 
}); 

Working example

注上記の三元表現の使用を経由して多くを短縮することができるが、私はあなたができるように、冗長に保管しました何が起きているのかがはっきり分かる。