javascript - html 要素から重複を削除する

Question

これからブドウの重複を取り除く最良の方法は何ですか? 単純な配列から重複を削除する方法はたくさんありますが、これは html 要素を持つ配列になります。

 <div class="fruit">
      grapes
 </div>
 <div class="fruit">
      bananas
 </div>
 <div class="fruit">
      grapes
  </div>

私は次のようなものを使用してみました

 $('.fruit').each(function () {
      $('.fruit:has("' + $(this).text() + '"):gt(0)').remove();  
 });

score 3 · Accepted Answer

試す

var obj = {};
$('.fruit').each(function(){
    var text = $.trim($(this).text());
    if(obj[text]){
        $(this).remove();
    } else {
        obj[text] = true;
    }
})

デモ:フィドル

score 2 · Accepted Answer

:has:contains文字列を受け取りながら要素セレクターを期待します

http://api.jquery.com/contains-selector/を参照してください

したがって、これでうまくいくはずです：

 $('.fruit').each(function () {
      $('.fruit:contains("' + $(this).text() + '"):gt(0)').remove();  
 });

フィドル: http://jsfiddle.net/kam7E/

score 0 · Accepted Answer

var uniqueFruits = [];
$(".fruit").each(function(i,e){
    var thisFruit = $.trim($(e).text());
    if(uniqueFruits.indexOf(thisFruit) == -1)
        uniqueFruits.push(thisFruit);
    else
        $(e).remove();
});

http://jsfiddle.net/a7E9e/

score 0 · Accepted Answer

jsFiddle はこちら: http://jsfiddle.net/THEtheChad/UKRwf/

var found = {};
var $unique_fruits = $('.fruit').filter(function(){
   var data = this.innerHTML.trim();

   if(!found.hasOwnProperty(data)) return found[data] = true;
});

score 0 · Accepted Answer

http://jsfiddle.net/S3wXM/1/

重複の 1 つだけを削除したいとします。

上記の回答のようにcontainsを使用しますが、実装は少し異なります。

$($("div:contains('grapes')")[0]).remove();

http://api.jquery.com/jQuery.unique/ - これも役に立つかもしれません。

score -1 · Accepted Answer

これがこのための実用的なフィドルです:-

http://jsfiddle.net/HwUUs/1/

$( "div:contains('grapes')" ).remove();

javascript - html 要素から重複を削除する

6 に答える 6

Related

Reference