根据类删除重复的tr(仅当连续的tr具有相同的类时)

Question

有两个tr具有相同的类"redline"，一个接一个(连续出现(，我想删除其中的一个"tr"。

这是HTML示例

<table id="test"> 
<tr class="redline"><td>bla</td></tr> 
<tr class="redline"><td>bla</td></tr>
<tr class="blueline"><td>bla</td></tr>
<tr class="redline"><td>bla</td></tr>
<tr class="blueline"><td>bla</td></tr>
<tr class="redline"><td>bla</td></tr>
<tr class="redline"><td>bla</td></tr>
<tr class="blueline"><td>bla</td></tr>
</table>

Answer 1

考虑在CSS中使用+选择器。

https://www.w3schools.com/cssref/css_selectors.asp

以下是示例：

const dups = document.querySelectorAll('.redline + .redline')
dups.forEach((dup) => {dup.remove()})

<table id="test">
<tr class="redline">
<td>bla</td>
</tr>
<tr class="redline">
<td>bla dulplicate</td>
</tr>
<tr class="blueline">
<td>bla</td>
</tr>
<tr class="redline">
<td>bla</td>
</tr>
<tr class="blueline">
<td>bla</td>
</tr>
<tr class="redline">
<td>bla</td>
</tr>
<tr class="redline">
<td>bla dulplicate</td>
</tr>
<tr class="blueline">
<td>bla</td>
</tr>
</table>

Answer 2

document.querySelectorAll("#test .redline").forEach(function(element){
if(document.querySelectorAll("#test .redline").length > 1)
element.remove()
});

<table id="test">
<tr class="redline"=1><td>bla</td></tr>
<tr class="redline"=1><td>bla</td></tr>
<tr class="blueline"=1><td>bla</td></tr>
<tr class="redline"=1><td>bla</td></tr>
<tr class="blueline"=1><td>bla</td></tr>
<tr class="redline"=1><td>bla</td></tr>
<tr class="redline"=1><td>bla</td></tr>
<tr class="blueline"=1><td>bla</td></tr>
</table>