HTMLのtbodyの目的は何ですか？

Question

誰かがHTMLのtbodyをテーブルに使用する主な理由は何ですか？それはフォーマット目的のためだけですか？

私はheadとbodyを一般的に使用します。私はtheadとtbodyを使用していません。

Answer 1

あなたのテーブルにセマンティックな意味を与えるために：

<table> 
    <thead> 
    <tr> 
     <th>Person</th> 
     <th>Amount</th> 
     <th>Date</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr> 
     <td>Person1</td> 
     <td>$5.99</td> 
     <td>02/03/09</td> 
    </tr> 
    <tr> 
     <td>Person2</td> 
     <td>$12.99</td> 
     <td>08/15/09</td> 
    </tr> 
    </tbody> 
</table> 

According to the specificationを：

表の行が使用して、表頭、テーブルの足、および1つのまたは複数のテーブル本体のセクションにグループ化することができますTHEAD、TFOOTおよびTBODY要素にそれぞれ対応します。この分割により、使用者エージェントはテーブルの頭と足とは独立してテーブル本体のスクロールをサポートできます。長い表が印刷されると、表の頭と足の情報が表データを含む各ページで繰り返されることがあります。

テーブルの頭と脚には、テーブルの列に関する情報が含まれている必要があります。表本体には表データの行が含まれている必要があります。

存在する場合、各THEAD、TFOOT、およびTBODYには行グループが含まれます。各行グループには、TR要素で定義された少なくとも1つの行が含まれている必要があります。

この重要な意味の重要性（スクリーンリーダーと考える）以外にも、ヘッダーをデータ行から簡単に除外できます。もう1つの関連する例は、TablesorterプラグインのようなjQueryプラグインで、データ構造がどのように見えるかを簡単に把握できます。

Answer 2

HTMLテーブルのヘッダ（thead）、body（tbody）、footer（tfoot）の部分を区切ります。これは信じられないほどです。典型的な使い方は、あなたのthead要素にカラムヘッダーを、tbodyにデータを入れることです。 tfoot要素はあまり一般的ではありませんが、時には便利です。

ところで、あなたがtbodyを指定しなくても、暗黙のうちにあなたのために作成されます。

あなたは、例えば、あまりにもスタイリングの目的のためにこれを使用することができます。

table thead tr { background-color: yellow; } 
table tbody tr { background-color: #C9C9C9; } 

それは（ほんの一例として）選択行を持つテーブルを持つためにはJavaScriptとjQueryにも便利です。一般的には、上部の見出し行ではなく、tbodyの行を選択またはハイライト表示するだけです。

Answer 3

これはスタイリングに使用できます。はい、jQueryセレクタが選択したい要素を区別するのに役立ちます。結局のところtrタグはtheadまたはtbodyにあることができます。

Answer 4

私がtbodyで見つけた1つの大きな用途は、列ヘッダーとフッターを表示したまま行をスクロールできるようにすることです。これは実際にCSSをサポートしているブラウザでのみ機能します。申し訳ありませんInternet Explorer！

<tbody style="height: 150px; overflow-y: scroll"> 

Answer 5

テーブルのヘッダーがすべての行の最初の列の場合はどうなりますか？その場合、テーブルのヘッダを指定する方法はありません。パーサーは、すべてがテーブル本体に含まれていると想定するため、実際にはHTMLを破棄します。

thはヘッダーフィールドを指定するため、なぜこのタグが必要なのですか？ブラウザーは、これらのフィールドによって表のどの部分がヘッダーであるかを知ることができます。

theadとtbodyのポイントは何ですか？ 場合によっては動作し、その他の場合はHTMLを破棄します。 これらはthの機能を複製します。 彼らはコードを複雑にし、問題を引き起こす可能性があります - 私はtbodyについて知る前に、tr-sはテーブルの子であると仮定しました。

Answer 6

THEADは、HTMLでTBODY、及びTFOOT要素は、その内容に基づいて、論理セクションにグループテーブルの行に使用されます。

1. は、それが簡単に別のセクションに異なるスタイル規則を適用できるようにするための体は、ヘッダおよび/またはフッタ
2. から独立してスクロールできるようにするには、次の2つの主な理由は、あなたがこれをしたいと思いますがありますテーブルの

<table> 
 
    <thead> 
 
    <tr> 
 
    <th>Month</th> 
 
    <th>Savings</th> 
 
    </tr> 
 
    </thead> 
 
    <tfoot> 
 
    <tr> 
 
     <td>Sum</td> 
 
     <td>$180</td> 
 
    </tr> 
 
    </tfoot> 
 
    <tbody> 
 
    <tr> 
 
    <td>January</td> 
 
    <td>$100</td> 
 
    </tr> 
 
    <tr> 
 
     <td>February</td> 
 
     <td>$80</td> 
 
    </tr> 
 
    </tbody> 
 
</table>