Keith
Keith

Reputation: 26499

JQuery: Remove duplicate elements?

Say I have a list of links with duplicate values as below:

<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>

How would I, using JQuery, remove the dups and be left with the following for example:

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

Basically I am looking for a way to remove any duplicate values found and show 1 of each link.

Upvotes: 46

Views: 95594

Answers (8)

user32285
user32285

Reputation: 19

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

Upvotes: -2

Ben Muircroft
Ben Muircroft

Reputation: 3034

@interjay @Georg Fritzsche

Your fix didn't work in my case so I build a different version:

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

Hopes this provides someone else with a valid alternative short fix just in case.

Upvotes: 1

Saleh
Saleh

Reputation: 43

$(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();
            }
        });
    }); 
});

Upvotes: 1

Eduardo Telaya
Eduardo Telaya

Reputation: 39

Nice solution people. Here is mine

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;
    }
  }
}

Greetings

Upvotes: -1

Vladimir
Vladimir

Reputation: 183

Use jQuery method $.unique()

Detail see on http://api.jquery.com/jQuery.unique/

Upvotes: 11

interjay
interjay

Reputation: 110108

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

Explanation:

seen is an object which maps any previously seen text to true. It functions as a set containing all previously seen texts. The line if (seen[txt]) checks to see if the text is in the set. If so, we've seen this text before, so we remove the link. Otherwise, this is a link text we see for the first time. We add it to the set so that any further links with the same text will be removed.

An alternative way to represent a set is to use an array containing all values. However, this would make it much slower since to see if a value is in the array we'd need to scan the entire array each time. Looking up a key in an object using seen[txt] is very fast in comparison.

Upvotes: 135

Anders Mattson
Anders Mattson

Reputation: 1

A quick and easy way would be

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

Upvotes: -1

coolnalu
coolnalu

Reputation: 355

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

Upvotes: 6

Related Questions