1

テーブルの最初の行を除くすべての列をにしたいと思います。text-align:left最初の列はtext-alignCSSで定義されています。コードは次のとおりです。

<script type="text/javascript" src="../js/jquery-1.9.1.min.js"></script>
<style type="text/css">
table{
    border: 1px solid red;
    border-collapse: collapse;
}
table td{
    border: 1px solid red;
    text-align: center;
}
</style>
  <script type="text/javascript">
$(function(){
    $("input[type='button']").on("click", function(){
        $("#table tr td:gt(0)").css({"text-align":"left"}); 
    });

});
</script>
 </head>
<body>
<input type="button" value="click" />
<table id="table">
    <tbody>
        <tr><td width="150px">center</td><td width="150">left</td><td width="150">left</td></tr>
        <tr><td>center</td><td>left</td><td>left</td></tr>
                    <tr><td>center</td><td>left</td><td>left</td></tr>
    </tbody>
</table>
</body>

ボタンをクリックすると、最初の行だけが効果を発揮し、他の行のすべての列にはtext-left最初の列が含まれますが、そうではありません。なぜ?trメソッドを使用して要素を反復処理する必要がありeachますか?

4

2 に答える 2

4

現在のjQueryコードは、すべてtdの'を取得してから、最初のコレクションを取得します...このコレクションtdを取得すると、そのコレクションの最初を取得します...これが現在のコードで発生したことです...

コードをこれに置き換えてください...

$(function(){
    $("input[type='button']").on("click", function(){
        $("#table tr td").not(':first-child').css({"text-align":"left"}); 
    });

});

そして、cssを使用できる場合ははるかに優れています。

table td{
    border: 1px solid red;
    text-align: left;
}

table td:first-child {
    text-align: center;
}
于 2013-03-21T03:35:39.530 に答える
0

またはとを使用し:notます。.not():first

$('#table tr td:not(#table tr td:first)').css({"text-align":"left"}); 

また

$('table tr td').not(':first').css({"text-align":"left"}); 
于 2013-03-21T03:38:06.870 に答える