0

次のようなテーブルがあります。最初のヘッダー列にのみ背景色 (黄色) を指定する必要があります。また、すべてのテキストの色は、ヘッダーで青にする必要があります (両方の列で)。jQueryを使用してそれを達成する方法は何ですか?

注: jQuery を学習しようとしています。したがって、解決策はjQueryを使用する必要があります。

   <table id = "myTable">
        <thead>
            <tr>
                <th>
                     <a href="http://www.Lijo.com">Name</a>
                </th>
                <th>
                    Address
                </th>
            </tr>
        </thead>
        <tr>
            <td>
                Lijo
            </td>
            <td>
                India
            </td>
        </tr>
    </table>
4

4 に答える 4

1

次のように最初のヘッダー列を選択できます。

var firstColumnHeader = $('#myTable thead th:first-child');

css次に、次のようにメソッドを使用して背景色を更新できます。

firstColumnHeader.css('background', '#FCD116');

これはjsfiddleデモストレーションです。

于 2012-05-17T09:47:20.953 に答える
1

これは、クラス名がすべてのスタイリングを行う最初のヘッダー用です。セレクターは #mytable 内のすべての「th」を取得し、eq(0) を使用して最初の th を取得し、それにクラスを追加します

$("#myTable th").eq(0).addClass("ClassName")

これは、クラス名 2 がスタイリングを行う必要があるすべてのヘッダーに対して

$("#myTable th").addClass("ClassName2")
于 2012-05-17T09:48:35.283 に答える
1

Hiyaデモ http://jsfiddle.net/r3jMv/1/ (更新) (古い =>) http://jsfiddle.net/Zarhu/2/

ここに青い色があります: http://jsfiddle.net/r3jMv/6/以下のコメントからの別の更新バージョン: http://jsfiddle.net/cC6hk/

以下はトリックを行う必要があります。

これは良い遊び場かもしれません: http://vkanakaraj.wordpress.com/2009/06/18/select-a-column-of-a-table-using-jquery/

jqueryコード

$(function(){
  // Change first column background color.

  $("table thead tr th:first-child").css("background-color","#ff0000");
});

</p>

$("#myTable > thead > tr >th").css("background-color","yellow");​

html

<table id = "myTable">
        <thead>
            <tr>
                <th>
                    Name
                </th>
                <th>
                    Address
                </th>
            </tr>
        </thead>
        <tr>
            <td>
                Lijo
            </td>
            <td>
                India
            </td>
        </tr>
    </table>
​
于 2012-05-17T09:46:15.660 に答える
1
$("#myTable th:first").css({
    "background-color": "yellow"
});
$("#myTable th").css({
    "color": "blue"
});​

1行で同じことを達成することもできます:

$("#myTable th")
    .css({"color": "blue"})
    .filter(":first")
    .css({"background-color": "yellow"});​
于 2012-05-17T09:53:39.070 に答える