HTML参考 :TBODY元素 详解

摘要:
TBODY元素中包含的有效标记是:TDTHTRTBODY将自动为所有表定义,即使表未显式定义TBODY。通过使用浏览器中的滚轮,可以从头到尾直接浏览此分区。打印时,页眉和页脚将重新添加到表的标准属性中:id、class、title、style、dir、lang、xml:lang事件属性:onclick、ondblclick、onmousedown、onmouse up、onmousesover、onmousemove、onmous out、onkeypress、onkeydown、,Onkeyup实例:<tableborder=“1”><thead><tr><td>此文本位于HEAD</td></tr></HEAD><tfoot><tr<td>该文本位于tfoot</td<</tr></foot><tbody><tr><td<此文本位于tbody</td’</tr<</tbody></table和tbody元素中。BODY是HTML的文本主体。HTML文件中只有一个BODY,TABLE中可以有多个TBODY。然而,XHTML中的改进是意料之中的。
TBODY 元素内包含的有效标签有:

TD
TH
TR

TBODY 元素会为全部表格自动定义,就算表格没有显式定义 TBODY 元素。

table 对象及其相关的元素有独立的表格对象模型,这与常规对象模型所采用的方法有很大不同。

此元素在 Microsoft? Internet Explorer 3.0 的 HTML 中可用,在 Internet Explorer 4.0 的脚本中可用。

此元素不会被渲染。

此元素需要关闭标签。

tbody定义表格的主体
     在table中thead,tfoot以及tbody可以让你聚集表格中的多个行。当你建立一个表格的时候你或许希望有一个标题行,一些行来放置数据,最下的一行来放总计。这样的划分在浏览器中可以使用滚轮从头到尾直接浏览,当打印的时候每有超出部分那么页眉和脚标会重新加到表格上(保证打印出来的每页都有页眉和脚标)
 
标准属性:id, class, title, style, dir, lang, xml:lang

事件属性:onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup

实例:
<table border = "1">
<thead>
<tr>
<td>This text is in the THEAD</td>
</tr>
</thead>
<tfoot>
<tr>
<td>This text is in the TFOOT</td>
</tr>
</tfoot>
<tbody>
<tr>
<td> This text is in the TBODY</td>
</tr>
</tbody>
</table>

每个表格可以有一个表头、一个表尾和一个或多个表体,分别以THEAD、TFOOT和TBODY元素表示。

用TBODY这个标签可以控制表格分行下载,当表格内容很大时比较实用,在需要分行下载处加上<tbody>和</tbody>,比如:

<table>
<tbody>
<tr><td>有风的日子</td></tr>
<tr><td>有风的日子</td></tr>
</tbody>
<tbody>
<tr><td>有风的日子</td></tr>
<tr><td>有风的日子</td></tr>
</tbody>
</table>
·<tbody>是用在<table>内的比如:
<table>
  <tbody>
     <tr>
        <td></td>
     </tr>
  </tbody>
</table>
使用TBODY的目的是可以使得这些包含在内的代码不用在整个表格都解析后一起显示,就是说如果有多个行,那么如果得到一个TBODY行,就可以先显示一行。
BODY是HTML的文本体,一个HTML文件,只有一个BODY,而在TABLE中可以有多个TBODY。

·默认的时候,可以不用写<tbody>
但要使用innerHTML 更改 Table 的内容的时候,必须指明 TBody

<table>
<tbody id="oTbody">
</tbody>
</table>

oTbody.innerHTML="<tr><td>呵呵</td></tr>";

·当你使用了thead, tfoot 和 tbody元素,那么你就必须使用它们每一个元素,它们出现的次序也应该是这样:<thead>, <tfoot> 和 <tbody>,只有这样浏览器才能在接收所有数据前先得到脚标的信息。还有一点你必须在table元素内使用它们

·<thead>,<tbody> 和 <tfoot>并不常用,因为它们的浏览器支持性不好。不过预计会在XHTML中得到改善。如果你有IE以上版本的浏览器,那么你可以看看我们XML教程中的一个举例

免责声明:文章转载自《HTML参考 :TBODY元素 详解》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇Unity 角色控制器 Charactor ControllerPHP之Smarty模板引擎下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

利用ajax获取后端数据存放入前端(.html文件)页面&amp;lt;td&amp;gt;&amp;lt;/td&amp;gt;中

1. 针对的问题: 由于便捷高效,大部分前端采用jsp,但仍存在前端页面为index.html文件,所以,对于前后端数据的传送及显示有一定的问题。 2. 解决办法: 声明:本人前端页面名称index.html,后端产生数据的是servlet层,文件名称为 Pre_sensorServlet.java 需要给以下页面标红的格子里传入由后端获取到的数据(因为项...

iOS 杂笔-如何解决tableview显示错乱问题

解决自定义Tableviewcell显示错乱问题 要是要解决这个问题,就需要用到UITableviewCell的prepareForReuse方法 cell被重用如何提前知道? 重写cell的prepareForReuse 官方头文件中有说明.当前已经被分配的cell如果被重用了(通常是滚动出屏幕外了),会调用cell的prepareForReuse通...

Vue根据浏览器窗体变化动态设置Element Table组件的最大高度

Vue根据浏览器窗体变化动态设置Element Table组件的最大高度 这个场景应该经常遇到,比如说在一个页面有一个table,想让他数据过多的时候自动出现滚动条而不至于冲到屏幕外被隐藏,如果表格下面还有换页的话,换页直接冲没了,所以需要计算这个table表格的最大高度。 使用的是饿了吗Element组件库的table组件,有一个属性是 max-heig...

html css项目积累汇总

1、关于ul的padding-left:40px的问题; 首先,我们来看一段代码: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>ul的padding-left:40...

Web项目的WEB-INF目录使用说明以及重定向与转发

写这篇文章的原因是看到了Tomcat下面的Webapps下面的,就想看一下。 总结一下这篇文章的内容: WEB-INF下面的内容都是只能由服务器级别才能访问,客户端并不能访问。什么是客户端级别?什么是服务器级别呢? 转发就是服务器级别,浏览器的地址不会变,因为,客户端发送一个请求,服务器受理之后,发现要请求内容还要再去别的请求,那么转发就是服务器自己去处理...

解决: Table XX.QRTZ_LOCKS doesn`t exist 的问题

本机环境 window10专业版2004WSL2(Ubuntu18.04)下的Docker容器(Mysql5.7.22) 问题描述: Quartz定时任务项目, 数据库从Windows Mysql迁移到Docker Mysql容器后, 启动项目时, 报Table 'xx.QRTZ_LOCKS' doesn't exist错误 问题原因: Linux系统下M...