0

これが私のコードです：

<script type="text/javascript">
$(function(){
    $("input[type='button']").click(function(){
        $("#table tbody").append($("<tr>").append($("<td>").text("new")));
    });

            /*double-color effect*/
    $("#table tbody tr:even").css({"background":"lightgray"});
    $("#table tbody tr:odd").css({"background":"white"});
});
</script>
</head>
<body>
<input type="button" value="click" />
<table id="table">
    <tbody>
        <tr><td>hello</td></tr>
        <tr><td>world</td></tr>
        <tr><td>I am here</td></tr>
    </tbody>
</table>
</body>

新しく作成した要素にも二重の色の効果を持たせたいのですが、そうではありません.jQueryがCSSの動的適用をサポートできるかどうかtrを知りたいのですが、メソッドはそうですか? また、次のようなコードでセレクターを使用することもできます。live()on()nth-child

  tr:nth-child(odd)
{
    background:lightgray;
}
tr:nth-child(even)
{
    background:white;
}

しかし、w3cschoolsが言ったように、IE8 およびそれ以前のバージョンをサポートしていません。Chrome、Firefox、Safari などの他の主要なブラウザーの以前のバージョンもこのセレクターをサポートしているかどうかはわかりません。それで、これを行う互換性の高い方法はありますか？

4

2 に答える 2

2 
$("#table tbody tr:even").css({"background":"lightgray"});

既存の要素を変更するだけで、css ルールを追加しません。新しい要素に適用する場合は、要素を追加した後にもう一度実行する必要があります。関数に与えるイベントハンドラーに入れるだけですclick。

于 2013-03-20T12:08:20.707 に答える
0

以下に示すように、スクリプト タグを変更します。

<script type="text/javascript">
$(function(){
    $("input[type='button']").click(function(){
        $("#table tbody").append($("<tr>").append($("<td>").text("new")));
        ApplyCss();
    });

   ApplyCss();
});

function ApplyCss() {
            /*double-color effect*/
    $("#table tbody tr:even").css({"background":"lightgray"});
    $("#table tbody tr:odd").css({"background":"white"});
}
</script>

このApplyCss()関数は、 new を追加すると適用されcssます。trtable

于 2013-03-20T12:11:59.593 に答える