jquery - jQuery を使用して、ページ上のすべてのテーブルの最初の行のスタイルを設定する方法

Question

ページ上のすべてのテーブルの最初の行を手動でスタイルする必要があります。残念ながら、私はいくつかの古いブラウザーを扱っているので、jQuery 経由でこれを行いたいと考えています。

現在私は使用しています：

$(function() {
 $(".OpenCourse tr:first").addClass("OpenCoursesHeader");
});

次にスタイルに追加.OpenCoursesHeader td {}します。

クラスOpenCoursesHeaderは最初のテーブルにのみ適用されるようです。

2番目に適用する方法はありますか? 単純にする場合、ページには常に 2 つのテーブルしかありません。

score 3 · Accepted Answer

first-childセレクターを使用できます。first作業しているセレクターの最初の要素のみを選択します。

$(function() {
 $(".OpenCourse tr:first-child").addClass("OpenCoursesHeader");
});

ただし、ネストされたテーブルがある場合、このソリューションはクラスを最初のにも追加しtrます。

score 1 · Accepted Answer

あなたは使用することができfind()、それは動作します：

$(".OpenCourse").find("tr:first").addClass("OpenCoursesHeader");

デモ: http://jsfiddle.net/bUqPX/1/ -- Fabrícioに感謝:)

score 1 · Accepted Answer

$(function() {
    $(".OpenCourse tr:nth-child(1)").addClass("OpenCoursesHeader");
});

<thead>また、 / <tbody>/要素がある場合、これは適切に機能しない可能性が<tfooter>あります。その場合、スタイルを適用する要素もセレクターで指定する必要があります。

$(".OpenCourse thead:nth-child(1) tr:nth-child(1)").addClass("OpenCoursesHeader");

score 0 · Accepted Answer

$(function() {
    $(".OpenCourse").each(function() {
        $("tr:first",this).addClass("OpenCoursesHeader");
    });
});

試してみてください。私たちが見ることができるコードのあるページはありますか?

score 0 · Accepted Answer

table最初に選択してfindonを実行しtr:firstます。

OpenCourse以下は、テーブルのコレクションのコンテナであると仮定しています..

$(".OpenCourse table").find("tr:first").addClass("OpenCoursesHeader");

OpenCourseがテーブルのクラスである場合は、 @Visionの答えを試してください

score 0 · Accepted Answer

これを試して：

$(function() {  
     $("table tr:first").addClass("OpenCoursesHeader"); 
});

これは、ページ上のすべてのテーブルに適用されます。お役に立てれば！！

6 に答える 6