0

特定のスタイルの tr 内にある td セルの色を変更するにはどうすればよいですか?

例えば：

<tr style="display: table-row">
<td></td>
<td></td>
</tr>

私はこれまでこれを行ってきましたが、完全には機能しません:

if ($('.mydiv').css('display') == 'table-row') {
   $(this).siblings('td').css("background-color", "white");
}
4

4 に答える 4

5

私の最初の考えは、テストされていませんが、次のようになります。

$('td').filter(function(){
    return this.parentNode.style.display == 'table-row';
}).css('background-color','#fff');

書かれているように、これはすべての要素を選択し、親が;tdを持つ要素にフィルタリングします。ただし、これにはスタイルがインラインで設定されている必要があります。ただし、もう少しjQueryを投げると、次の方法で同じことが実現できます。trstyle="display: table-row;"tr

$('td').filter(function(){
    return $(this).parent().css('display') == 'table-row';
}).css('background-color','#fff');

これは同じ方法でフィルタリングされますが、外部スタイルシート (またはドキュメントのstyleタグ) に設定された CSS が含まれます。head

ただし、DOM トラバーサルを減らし、tr要素のみを明示的に処理し、特定のクラス名を使用して同じことを達成します。

$('tr').filter(function(){
    return $(this).css('display') == 'table-row';
}).addClass('hasDisplayTableRow');

もちろん、これにより CSS を使用できます。

tr.hasDisplayTableRow td {
    /* css */
}
于 2013-04-24T21:21:00.393 に答える
3

スタイルに対してそれを行うことはできません。クラスが必要です。

<tr style="display: table-row" class="myrow">
    <td></td>
    <td></td>
</tr>

次に、css でスタイルを設定できます。

tr.myrow td{
    background-color: white
}

またはjQueryで：

$("tr.myrow td").css({"background-color": "white"})

EDIT Davidの答えは、それが可能であることを示唆しています。それは賢いですが、クラスアプローチはより保守しやすいIMOです

于 2013-04-24T21:21:22.283 に答える
0

インライン スタイルを比較することは、必ずしも良い考えではありません。

代わりに、問題の tr にクラスを追加して、よりクリーンになるようにしてください。

.table-row{
   display: table-row;
}

次に、これを使用できます

if ($('.mydiv').hasClass('table-row')) {
   $(this).siblings('td').css("background-color", "white");
}

これの代わりに<tr style="display: table-row">

マークアップを変更してみてください

<tr class="table-row">
于 2013-04-24T21:23:07.087 に答える
0

CSSでこれをやらないのはなぜですか？JQueryでそれを行う方法は次のとおりです。

$("tr[style='<your style value here>'] td").css("background-color", "white");
于 2013-04-24T21:23:12.917 に答える