`

IE7、IE8 对于W3C标准 tbody 的兼容问题

阅读更多
最近在处理静态化模板的时候,动态生成右上角登录框,出现了IE7无法显示的问题。
在IE7中一闪而过。
但是在IE8、firefox、chrome 中都能正常显示。
源码如下(涉及商业问题,略作修改):
//登录html
function DLH(loginName){
	var dengl = "";
   	dengl+='<tr>';
    dengl+='    <td>您好,'+loginName+' 【<a href="javascript:logout();">退出登录</a>】【<a href="userQ.html">我的组织</a>】&nbsp;<a href="#">帮助</a></td>';
    dengl+='</tr></tbody>';
    return dengl;
}


之后发现此源码并不是很规范,没有严格执行W3C标准,才会出现以上不兼容问题!
更改的地方其实很简单,就是增加 <tbody>

修改后如下:
//登录html
function DLH(loginName){
	var dengl = "";
   	dengl+='<tbody><tr>';
    dengl+='    <td>您好,'+loginName+' 【<a href="javascript:logout();">退出登录</a>】【<a href="userQ.html">我的组织</a>】&nbsp;<a href="#">帮助</a></td>';
    dengl+='</tr></tbody>';
    return dengl;
}


之后经过询问高人,明白了<thead> <tbody> <tfoot>的好处。

总结如下:
<table>
<thead><tr>...</tr></thead>
<tbody><tr>...</tr></tbody>
<tfoot><tr>...</tr></tfoot>
</table>
当然没有必要全都用到,但是必须记住的是如果有thead或tfoot,就必须要tbody。

加了tbody后准确来说并不是影响下载速度,而是呈现速度。

浏览器对Table的解释是等待整个table全部加载完才显示。
如果加入tbody,浏览器则一边下载一边显示已经下载的内容。
分享到:
评论

相关推荐

    IE6-IE9兼容性问题列表及解决办法

    **描述**:在IE9中,表对象模式(Table Object Model, TOM)的实现更加接近W3C的标准和其他主流浏览器的表现,这对于使用表格进行复杂布局的场景尤其重要。 **示例**: ```html 标题1 标题2 &lt;tbody&gt; ...

    jquery appen table 问题 ie8下解决方法

    - IE8的DOM操作限制:IE8并不完全支持W3C标准,特别是关于动态创建和修改DOM元素的部分。这可能使`append()`在某些场景下表现不一致。 - 表格元素的插入规则:在HTML中,`&lt;tr&gt;`元素必须直接位于`&lt;tbody&gt;`内,而`...

    AJAX新手快车道

    - **标准化进程**:得益于W3C和ECMA等标准组织的努力,浏览器之间的差异逐渐缩小。 - **竞争与改进**:浏览器市场的竞争促使各厂商不断改进产品,提高对标准的支持度,减少特异行为。 #### 二、跨浏览器JavaScript...

    javascript 的面试题

    `FireFox和IE存在大量兼容性问题的主要原因在于他们对javascript的支持不同上` 部分正确,但不是主要原因之一。 - D. `AJAX技术一定要使用javascript技术` 错误。虽然AJAX主要依赖于JavaScript,但它也可以与其他...

    网站前端开发

    W3C 与 WAI 标准** - **W3C**: World Wide Web Consortium,负责制定并维护 Web 标准,包括 HTML、CSS 和 XML 等。 - **WAI**: Web Accessibility Initiative,关注无障碍 Web 设计,旨在使网站对所有人开放和可...

    javascript面试题汇总

    Firefox和IE的兼容性问题主要源于它们对标准的实现不同,而不是对JavaScript的支持不同;AJAX技术通常使用JavaScript,但不是必须的。 5. **对象属性访问**:JavaScript允许多种方式访问对象属性。选项A `foo.att`...

    javaScript面试精选

    - **选项C**: Firefox和IE浏览器存在兼容性问题的主要原因是它们对DOM和CSS的支持有所不同,而不是对JavaScript的支持差异。 - **选项D**: AJAX技术虽然经常使用JavaScript,但它并不要求必须使用JavaScript,也可以...

    跨浏览器开发经验总结(一) HTML标记

    4. **使用`tbody`元素**:在`table`元素中使用`tbody`元素可以提高代码的可读性和浏览器的兼容性,避免在JavaScript操作`tr`节点时出现问题。 5. **标签及属性的大小写**:虽然HTML标签名称和属性通常不区分大小写...

    各浏览器中querySelector和querySelectorAll的实现差异分析

    不过,对于某些版本的浏览器,如早期的IE,可能存在兼容性问题或限制。 在实际应用中,这两个方法通常作为替代其他DOM遍历方法(如 `getElementById`、`getElementsByClassName` 等)的方式,因为它们提供了更灵活...

    javascript的经典面试题汇总

    - **选项C**: `Firefox和IE存在大量兼容性问题的主要原因在于他们对javascript的支持不同上` - **解析**:虽然不同的浏览器对JavaScript的支持程度有所不同,但这并不是导致兼容性问题的主要原因。主要原因是浏览器...

    javascript笔试题目附答案@20081025_jb51.net

    - **选项C**: Firefox 和 IE 之间的兼容性问题主要在于它们对某些标准的支持程度不同,而不仅仅是 JavaScript 的支持。 - **选项D**: AJAX 技术虽然经常与 JavaScript 结合使用,但也可以使用其他技术如 ...

Global site tag (gtag.js) - Google Analytics