
在做頁面的時候,經常要根據不同的操作來顯示或隱藏一個表格中的部分內容,隱藏一行直接用<tr>標簽,隱藏多行時用<tbody>就很方便。
<table>
<tbody id="content1">
<tr><td>表單內容</td></tr>
</tbody>
<tbody id="content2" style="display:none">
<tr><td>多行內容</td></tr>
<tr><td>多行內容</td></tr>
</tbody>
</table>
用js來控制樣式display來顯示和隱藏,很方便。聽說這樣還可以控制網頁加載時顯示的順序,content1會比content2先顯示,而不是等表格加載完后一起顯示,沒有實驗過,在表格數據很多時會有作用。
使用過程中發現<tbody>不能嵌套使用,會出現莫名的問題,<tbody>是用來定義表格主體的,定義多個主體不說,主體里再來個主體確實不符合W3C對其的定義,像下面這樣使用看起來好像沒錯,但實際上是有錯誤的。
<table>
<tbody id="all">
<tbody id="content1">
<tr><td>表單內容</td></tr>
</tbody>
<tbody id="content2">
<tr><td>多行內容</td></tr>
<tr><td>多行內容</td></tr>
</tbody>
</tobdy>
</tbale>
做原型頁面時會為了實現交互效果才這樣用<tbody>,實際的后臺編程中用不著,只要根據判斷輸出相應的表體就行了。
頁面制作時表格的設計用<thead><tbody><tfoot><th><caption>等以前不常用的標簽加上CSS的定義可以實現很多不錯的效果,標準又語義,很強大,看過相關的一篇文章,找到收藏起來。