Tabellenzellen-Rahmen verschwinden, wenn einzelne tr auf display:none gesetzt werden

[Rolf B]

Hallo MudGuard,

ich habe das mit diesem HTML ausprobiert:

<table>
<tr><td>Huhu</td><td>Huhu</td><td>Huhu</td><td>Huhu</td></tr>
<tr><td>Huhu</td><td>Huhu</td><td>Huhu</td><td>Huhu</td></tr>
<tr><td>Huhu</td><td>Huhu</td><td>Huhu</td><td>Huhu</td></tr>
<tr><td>Huhu</td><td>Huhu</td><td>Huhu</td><td>Huhu</td></tr>
<tr><td>Huhu</td><td>Huhu</td><td>Huhu</td><td>Huhu</td></tr>
</table>

und diesem JavaScript:

setTimeout(kill, 2000);

function kill() {
   let r = document.querySelector("table tr:nth-child(3)");
   r.classList.add("hidden");
   // bzw: r.hidden = true;
}

und deinem CSS.

Ergebnis nach 2 Sekunden:

Im Kommentar ist die „richtigere“ Alternative: die hidden-Eigenschaft zu setzen anstatt das Verhalten dieser Eigenschaft mit einer Klasse nachzubauen. Sieht aber genauso aus.

Rolf