在基於一列的html表格中刪除重複的行

Question

<table id="test" border="1"> 
    <tr> 
     <td>test1<td> 
     <td>00.00.00<td> 
    </tr> 
    <tr> 
     <td>test2<td> 
     <td>00.00.00<td> 
    </tr> 
    <tr> 
     <td>test1<td> 
     <td>00.00.01<td> 
    </tr> 
    <tr> 
     <td>test2<td> 
     <td>00.00.01<td> 
    </tr> 
</table> 


<script type="text/javascript" > 
var seen = {}; 
    $('table tr ').each(function() { 
     var txt = $(this).text(); 
     if (seen[txt]) $(this).remove(); 
     else seen[txt] = true; 
    }); 
</script> 

我試過用上面的jquery腳本，但它在這種情況下失敗。我想刪除僅基於第一列的重複項。對此有什麼建議嗎？

Answer 1

變化：

var txt = $(this).text(); 

到：

var txt = $("td:first-child", $(this)).text(); 

FIDDLE

Answer 2

使用map()函數來創建包含該值和所述元件對象的數組。遍歷這個數組，將每個值與數組中的其他值進行比較，當遇到重複時刪除tr元素。

還應當指出的是，HTML有幾個未閉合td標籤

的Javascript

var values = $("#test tr td:first").map(function(){ 
    return {e: this, val: $(this).html()}; 
}); 

$.each(values, function(i,e){ 
    $.each(values,function(ind,el){ 
     if(el.val == e.val){ 
      $(el.e).parents("tr").remove(); 
     } 
    }); 
}); 

HTML

<table id="test" border="1"> 
<tr> 
    <td>test1</td> 
    <td>00.00.00</td> 
</tr> 
<tr> 
    <td>test2</td> 
    <td>00.00.00</td> 
</tr> 
<tr> 
    <td>test1</td> 
    <td>00.00.01</td> 
</tr> 
<tr> 
    <td>test2</td> 
    <td>00.00.01</td> 
</tr> 
</table> 

禾rking例http://jsfiddle.net/p72BB/3/

Answer 3

var arr = $("#test tr"); 

$.each(arr, function(i, item) { 
    var currIndex = $("#test tr").eq(i); 
    var matchText = currIndex.children("td").first().text(); 
    $(this).nextAll().each(function(i, inItem) { 
     if(matchText===$(this).children("td").first().text()) { 
      $(this).remove(); 
     } 
    }); 
}); 

DEMO