テーブルの行を削除しますが、CSSの代替の行の書式は

Question

のままにしておきます。そのため、行のフォーマットが交互になっています（灰色と白色）。私はtr.remove（）jquery関数を使って行を削除しています。もちろん、上/下の行のCSSは変更されず、奇数/偶数のスタイルを保持します。基本的に：

Before Deletion   After Deletion 

grey     grey 
white     white 
grey     white 
white     grey 
grey 

すぐにテーブルを強制的にスタイルをリフレッシュする方法はありますか？またはjqueryを使用して手動で適用する必要がありますか？

ありがとうございます！

Answer 1

奇数/偶数クラス/ハードコード値を使用する代わりに、CSSでスタイリングを行います。

document.querySelector("tbody").addEventListener("click", function(e) { 
 
    var td = e.target, 
 
     tr = td.parentNode; 
 
     tr.parentNode.removeChild(tr); 
 
    
 
});

tr:nth-child(even) { 
 
     background-color: #FFF; 
 
    } 
 
    
 
    tr:nth-child(odd) { 
 
     background-color: #CCC; 
 
    }

<table> 
 
    <tbody> 
 
    <tr><td>1</td></tr> 
 
    <tr><td>2</td></tr> 
 
    <tr><td>3</td></tr> 
 
    <tr><td>4</td></tr> 
 
    <tr><td>5</td></tr> 
 
    <tr><td>6</td></tr> 
 
    </tbody> 
 
</table>