通過類刪除後續重複的元素

通過javascript或jquery，我需要刪除集中的重複元素，以保持一個。它們都是一樣的，所以只要有一個被刪除就沒關係。出現頁面如下：保持每<div class="column-dude"></div>需要通過類刪除後續重複的元素

<div class="column-hr"></div> 
<div class="column-hr"></div> 
<div class="column-dude"></div> 
<div class="column-hr"></div> 
<div class="column-hr"></div> 
<div class="column-dude"></div> 
<div class="column-hr"></div>

一個<div class="column-hr"></div>之前，但每一個紈絝子弟列之前，以後每HR柱需要去。

我嘗試了以下，希望它會是這麼簡單。沒有工作。

$("div.column-hr").each(function(index) { 
    if ($(this).next('div.column.hr')) { 
     $(this).remove(); 
    } 
});

來源

2015-04-06 user1729506

你知道的HTML將每一次？你可以刪除它們，然後添加一個。 – tnschmidt

你可以把你想要的HTML之後。 – wonderbell

您可以sibling selector+實現這一目標。很容易的，也是最快的解決方案，因爲瀏覽器的CSS引擎將用於選擇元素：

$(".column-hr + .column-hr").remove();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="column-hr">hr</div> 
 
<div class="column-hr">hr</div> 
 
<div class="column-dude">dude</div> 
 
<div class="column-hr">hr</div> 
 
<div class="column-hr">hr</div> 
 
<div class="column-dude">dude</div> 
 
<div class="column-hr">hr</div>

它是如何工作的：CSS選擇器.column-hr + .column-hr選擇具有直接的一個同級.column-hr.column-hr元素。結果這個表達式會選擇全部相鄰的.column-hr元素除了第一個是，因爲第一個沒有另一個.column-hr就在它之前。

來源

2015-04-06 17:52:37 dfsq

不錯，它在jquery <2.1.1中工作嗎？ – RobertoNovelo

當然可以。所有的jQuery版本都支持'+'選擇器。 – dfsq

與我的回答（除了使用兄弟選擇器）的區別在於，第一個列hr將是剩下的，而我的將保留最後一個。 +1，之前從未見過兄弟選擇器。 – RobertoNovelo

你可以試試這個：

$(".column-hr").each(function() { 
    console.log($(this).html()); 
    console.log($(this).next().attr('class')); 

    if ($(this).next().attr('class') == 'column-hr') { 
     $(this).remove(); 
    } 

});

https://jsfiddle.net/aodnw5ns/

來源

2015-04-06 17:57:46 RobertoNovelo

var classesToRemove = ['column-hr', 'column-dude']; 
var $elements; 

for (var i = 0, l = classesToRemove.length; i < l; i++) { 
    // Find elements 
    $elements = $('.' + classesToRemove[i]); 

    var elementsLength = $elements.length; 

    // If there is more than one element 
    if (elementsLength > 1) { 
     // get all elements except the first 
     $elements = $elements.slice(1, elementsLength); 
     // remove them 
     $elements.remove(); 
    } 
} 

// prevent memory leaks 
$elements = null;

JSFiddle

來源

2015-04-06 18:02:45 covfefe

通過類刪除後續重複的元素

回答

相關問題