重複している要素があれば削除する、jQuery｜remove

  • 投稿日
  • 著者 アバター しんぺー
  • カテゴリー jQuery

重複しているコンテンツをjQueryで削除できないかな。

しんぺー

下にサンプルのコードを置いておきますね。
ただjQueryで非表示にしているだけなので、本来的には重複しているコンテンツがでてこないように調整する必要がありますね。まぁ、事情は色々ありますよね。

完成形のイメージ

下のCodePenでは、重複したお知らせを削除しています。

See the Pen Untitled by shimpei (@shimpei) on CodePen.

jQuery

他にもいろんな指定の仕方があるかと思いますが、今回はこんな感じにしてみました。
リスト内の各要素を反復処理し、重複する場合にはその要素を削除しています。

$(function() {
  var seen = {};
  $('#js-filter li').each(function() {
    var txt = $(this).find('time').text() + $(this).find('p').text();
    if (seen[txt]) $(this).remove();
    else seen[txt] = true;
  });
});

最後に

今回は短かったですが、これで終わりにしたいと思います。
活用できましたでしょうか？この記事があなたの助けになっていれば幸いです。

ありがとうございました！