0

ロード時にテーブルを非表示にし、クラス名に基づいてその子 td の 1 つを表示したかったのです。CSSでそれを行うことは可能ですか?

私はそれをやろうとしましたが、display:none; によって隠されているテーブルから継承していると思います。

4

3 に答える 3

7

テーブルを非表示にすると、テーブル内のすべてのコンテンツが非表示になります。

すべての を非表示にして、<tr>クラスごとにのみ表示したい

tr{
  display:none;
}
tr.showInit{
  display:table-row;
}
于 2012-10-25T20:01:01.440 に答える
5

非表示の親の子を表示することはできません。

ただし、他のすべての<td>-s を非表示にして、必要なものだけを表示することができます。

<style>
td { display: none }
td.shown { display: table-cell }
</style>

<table>
    <tr>
        <td> hidden </td>
        <td> hidden </td>
    </tr>
    <tr>
        <td class="shown"> shown </td>
        <td> hidden </td>
    </tr>
    <tr>
        <td> hidden </td>
        <td> hidden </td>
    </tr>
</table>

デモ


アップデート

JavaScript の使用

var tds = document.getElementsByTagName("td");

for ( var i = 0, size = tds.length; i < size; i++ ) {
    if ( !hasClass( tds[i], "shown" ) ) {
        tds[i].style.display = "none";
    }
}

function hasClass(element, cls) {
    return (' ' + element.className + ' ').indexOf(' ' + cls + ' ') > -1;
}

デモ

hasClass()関数

于 2012-10-25T19:59:17.273 に答える
1

を表示してを非表示にすることはできません ..それは不可能です。

代わりに、表示し たくないすべてのtdを非表示にします。

于 2012-10-25T19:59:54.013 に答える