[心得] jQuery.unique 討論

看板Ajax作者TonyQ (沉默是金。)時間15年前 (2010/09/08 23:35)推噓2(2推 0噓 3→)

留言5則, 3人參與討論串1/1

基本上我目前覺得應該是個蠻無用的 jQuery 內部函式（笑不過 jQuery tw google group 有人問所以翻了一下，順手一起把回應內容也貼過來囉。 ----------------------------------------------------- 先看看官方的 example http://api.jquery.com/jQuery.unique/ 官方的 exmaple 說明的蠻清楚的，重新解釋如下 ------------這是官方 example 的 html 部份 <div>There are 6 divs in this document.</div> <div></div> <div class="dup"></div> <div class="dup"></div> <div class="dup"></div> <div></div> ------------ 首先分析一下，整個sample 共6個div ，其中 ".dup" selector 可以拿到三個。 ------------ ------------這是官方 code var divs = $("div").get(); // unique() must take a native array // TonyQ: 這裡 get 是把 jQuerycontext // 轉成「真正的」 array 而已，本質上就是dom array。 // add 3 elements of class dup too (they are divs) divs = divs.concat($(".dup").get()); // 用陣列加法，把 ".dup"拿到的三個「真正的 dom array」加到這陣列， // 總共陣列中物件是九個，但是就真正的dom物件而言， // 這裡只有六個是不重複的。 $("div:eq(1)").text("Pre-unique there are " + divs.length + "elements."); //印出來驗證一下數量的確是九個 divs = jQuery.unique(divs); //去重複元素。 $("div:eq(2)") .text("Post-unique there are " + divs.length + "elements.") .css("color", "red"); //印出來確認一下，應該只留下六個 dom 。 -----------------------底下有幾點要注意的根據官方說明： This function only works on plain JavaScript arrays of DOM elements, and is chiefly used internally by jQuery. 也就是說這個只能比對 dom 物件，拿他來比其他東西是不會work的；另外它會重新照在 document 中出現的順序中排序，雖然這 feature 不一定用得到。 :p （As of jQuery 1.4 the results will always be returned in document order.）至於他的實做是直接採用 Sizzle engine 的 uniqueSort ，這實作內容也非常簡單。 :) Sizzle.uniqueSort = function(results){ if ( sortOrder ) { // sortOrder 有作 browser fix ，是一個排序用的函式（comparator） // 後面還有說明 hasDuplicate = baseHasDuplicate; //這裡有作一些browser fix，baseHasDuplicate 看成 false就好。 // sortOrder 的意義就是去找出他在 document 中的 index 來做比較， //並會以此判斷它有沒有 duplicate， //如果有找到，在這個sort的過程中會把 hasDuplicate 設成 true 。 // 所以如果有一個dom 是被clone過的，又剛好都出現在這陣列中， // 在這裡「不會」被當成 duplicate 濾掉。 // 例子看這 http://jsfiddle.net/tG9jN/ // 也因為這樣，所以它只能 support dom array 的運算，c // 不能用來做一般陣列的運算。 // 相關實做可以看 1.4.2 uncompressed 原碼 3364 行以後的部份， // 有提到用 sourceIndex 等瀏覽器資料來運算的實做。 results.sort(sortOrder); if ( hasDuplicate ) { for ( var i = 1; i < results.length; i++ ) { if ( results[i] === results[i-1] ) { results.splice(i--, 1); } } } } return results; }; -- 我：一半的日子讓你說，我聽你說你的所有______________________________________ ______________________________________一半的日子我想說，對你說過去的所有：我 _______________________________________________________ 在討論中妥善扮演兼具聆聽與分享的角色，是我們一生的課題。 _______________________________________________________ -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 114.137.2.106