2010-05-12 95 views
36

說我有與重複值的鏈接列表如下:JQuery:刪除重複的元素?

<a href="#">Book</a> 
<a href="#">Magazine</a> 
<a href="#">Book</a> 
<a href="#">Book</a> 
<a href="#">DVD</a> 
<a href="#">DVD</a> 
<a href="#">DVD</a> 
<a href="#">Book</a> 

我將如何,使用JQuery,刪除複本,並會留下例如以下:

<a href="#">Book</a> 
<a href="#">Magazine</a> 
<a href="#">DVD</a> 

基本上我我正在尋找一種方法來刪除找到的任何重複值並顯示每個鏈接的1。

回答

102
var seen = {}; 
$('a').each(function() { 
    var txt = $(this).text(); 
    if (seen[txt]) 
     $(this).remove(); 
    else 
     seen[txt] = true; 
}); 

說明:

seen是任何先前看到文本映射到true的對象。它的功能如同一個set包含所有以前看到的文本。行if (seen[txt])檢查文本是否在集合中。如果是這樣,我們之前已經看過這篇文章,所以我們刪除了這個鏈接。否則,這是我們第一次看到的鏈接文本。我們將其添加到集合中,以便刪除具有相同文本的任何進一步鏈接。

表示集合的另一種方法是使用包含所有值的數組。然而,這會讓它看起來慢得多,因爲看看每次我們需要掃描整個數組的值是否在數組中。使用seen[txt]在對象中查找關鍵字的速度非常快。

+1

Interjay,我感謝你,完美的作品。 另外,你會介意解釋你的代碼以理解它嗎? – 2010-05-12 21:48:13

+2

@Keith:添加了解釋。我假設你知道jQuery ['each'](http://api.jquery.com/each/)和['text'](http://api.jquery.com/text/)函數是做什麼的,所以沒有解釋這些。 – interjay 2010-05-12 22:00:10

+0

真棒,這對我來說完全是直接工作的 – jsims281 2010-06-13 22:11:32

3
// use an object as map 
var map = {}; 
$("a").each(function(){ 
    var value = $(this).text(); 
    if (map[value] == null){ 
     map[value] = true; 
    } else { 
     $(this).remove(); 
    } 
}); 
-1

一個快速簡便的方法是

$("a").​​​​​​​​each(function(){ 
    if($(this).parent().length) 
     $("a:contains('" + $(this).html() + "')").not(this).remove(); 
});​ 
12

使用jQuery方法$ .unique()

細節上http://api.jquery.com/jQuery.unique/

+6

爲什麼。爲什麼*包含的jQuery方法*有4個upvotes,而8行的副作用是坐在29並被接受? – Inaimathi 2012-10-14 15:32:10

+18

@Inaimathi:也許是因爲這個答案不正確。如果兩個元素具有相同的文本,'$ .unique'會將它們都留下,所以這不會做問題的提問。 '$ .unique'只有在數組中有兩個對同一個DOM元素的引用時纔有用,在這裏不是這種情況。 – interjay 2012-11-13 17:38:09

+4

此外,'$ .unique'只會從數組中移除條目,它不會從DOM中移除它們。 – interjay 2012-11-13 17:51:30

1

@interjay @Georg Fritzsche也

您的個人資料

var seen=''; 
    $('a').each(function(){ 
     var see=$(this).text(); 
     if(seen.match(see)){ 
      $(this).remove();} 
     else{ 
      seen=seen+$(this).text(); 
     } 
    }); 

希望在提供他人使用的有效替代短期修復,以防萬一:所以我建立一個不同版本的X並沒有我的情況下工作。

+1

我只是偶然發現了......沒有理由爲什麼@interjay方法不工作,再加上,這有可能導致誤報......如果您與這些文本有3個鏈接,請嘗試:「a」,「 b「和」ab「,」ab「鏈接將被刪除... – Salketer 2014-11-06 09:06:43

-1

不錯的解決方案的人。 這裏是我的

for (i = 0; i < $('li').length; i++) { 
    text = $('li').get(i); 
    for (j = i + 1; j < $('li').length; j++) { 
    text_to_compare = $('li').get(j); 
    if (text.innerHTML == text_to_compare.innerHTML) { 
     $(text_to_compare).remove(); 
     j--; 
     maxlength = $('li').length; 
    } 
    } 
} 

問候

1
$(document).ready(function(){ 
    $("select").each(function() { 
     var selectedItem = $(this).find('option').filter(':selected').text(); 
     var selectedItemValue = $(this).find('option').filter(':selected').val(); 
     $(this).children("option").each(function(x){ 
      if(this.text == selectedItem && $(this).val() != selectedItemValue) { 
       $(this).remove(); 
      } 
     }); 
    }); 
}); 
+1

請解釋它是如何解決問題的。 – 2014-02-19 12:42:26

+0

上午,我jst給了主意,但上面的一段代碼將保留選定的項目並刪除所選項目的重複。 – Saleh 2014-10-09 08:32:48

-2
$('.photo').each(function (index) { 
    if (index > 0) { 
     $(this).remove(); 
    } 
}); 
+3

這會除去第一個「書」之外的所有鏈接。 – Ben 2015-05-11 15:51:13