如何刪除錶行到其他行的末尾

我想獲取多個數據到表中，但有一行是複製totalColumn，當我刪除重複，其餘的駐留在表前。我想我來排的是前移到表的末尾如何刪除錶行到其他行的末尾

<table> 
    <tbody> 
    ...     
    <tr class="totalColumn"> 
     <td>Total</td> 
     <td></td> 
     <td></td> 
     <td class="sumofamount">@FuelHistory.sumOfTwo(d.driver.Id) Litres</td> 
     <td></td> 
     <td></td> 
    </tr> 
    </tbody> 
</table>

的Javascript用於刪除行：

$('.totalColumn').each(function() { 
    var thisId = $(this).find('.sumofamount').text(); 
    var $rowsToGroup = $(this).nextAll('tr').filter(function() { 
     return $(this).find('.sumofamount').text() === thisId; 
    }); 

    $rowsToGroup.each(function() { 
     $(this).remove(); 
    } 
);

來源

2017-07-18 gramanda grandish

表格行如何左移？或者你的意思是，如果該行有重複項，你希望他們在表的末尾刪除重複項？ – epascarello

你的問題是不清楚的...什麼意思左行..顯示一個適當的數據樣本和預期的結果 – scaisEdge

我的意思是我需要它到表的末尾的其餘行。 –

看來你有重複行，只想保留唯一一個，並將其移動到表格的末尾。下面將刪除所有，但totalColumn行之一，然後移動剩下一到含表部分的結尾：

function fixTable(){ 
 
    // Get the total column rows 
 
    var totalRows = document.querySelectorAll('.totalColumn'); 
 
    // Remove all but the first one 
 
    for (var i=1, iLen=totalRows.length; i<iLen; i++) { 
 
    totalRows[i].parentNode.removeChild(totalRows[i]); 
 
    } 
 
    // Move first to end of containing table section 
 
    totalRows[0].parentNode.appendChild(totalRows[0]);  
 
}

<table> 
 
    <tbody> 
 
    <tr><td>foo<td> 
 
    <tr><td>bar<td> 
 
    <tr class="totalColumn"><td>Total</td><td>1,000</td></tr> 
 
    <tr><td><td> 
 
    <tr class="totalColumn"><td>Total</td><td>1,000</td></tr> 
 
    <tr><td>fee<td> 
 
    <tr><td>fumm<td> 
 
    </tbody> 
 
</table> 
 
<button onclick="fixTable()">Fix table</button>

你也可以使用的forEach做同樣的事情，但是上述內容與所有瀏覽器兼容，無需填充或轉發，即可返回到IE 8。

的fixTable功能可以寫成：

function fixTable(){ 
    [].forEach.call(document.querySelectorAll('.totalColumn'), 
    (row, i) => row.parentNode[(i? 'remove' : 'append') + 'Child'](row) 
); 
}

但我認爲爲循環更容易閱讀，並與舊的瀏覽器非常多兼容（可能是更快的啓動）。

來源

2017-07-18 22:49:53 RobG

如何刪除錶行到其他行的末尾

回答

相關問題