javascript - JavaScriptで今日の日付を比較した後にCSSを置き換えます

Question

テーブルセルで動的に日付を生成するJSコードのこのブロックがあります。

'<td class="dateStyleBlue" data="date"><span id = "' 
+ customers.ProductID + 'date">' + util.utility( customers.GetDate) 
+ '</span></td>'

現在の CSS

.dateStyleBlue{
    color: blue;
    text-align:center;
    font-size: 10px;
}

新しい CSS スタイル

.dateStyleRed{
    color: red;
    text-align:center;
    font-size: 10px;
}

日付が今日を過ぎている場合、現在の CSS クラスを新しい CSS に置き換えたいと考えています。

だからここに私がこれまで持っているものがあります、

    var today = new Date();

    if (customer.GetDate < today) {
       $(dateStyleBlue).replaceWith(dateStyleRed);    
    }

score 1 · Accepted Answer

removeClass と addClass を実行する必要があります。

 if (customer.GetDate < today) {
       $('.dateStyleBlue').removeClass('dateStyleBlue').addClass('dateStyleRed');    
 }

ドット ( . ) を使用してクラスを選択することを忘れないでください。JavaScript 変数でない限り、文字列である必要があります。

編集

上記のコードはすべての要素をクラスで変更するため、セレクターをより具体的にする必要がありますdateStyleBlue

score 0 · Accepted Answer

まず、「table_row」など、参照する別のクラスを提供します。

次に、クラスを切り替えたい場合は、次のコードを使用します。

$(".table_row").removeClass("dateStyleBlue");
$(".table_row").addClass("dateStyleRed");

クラスごとに参照するには、ドットを使用することを忘れないでください!

2 に答える 2