web development blog

> 前端技术 html5兼容处理:旧版ie也能认识html5

 毫无疑问,HTML5 是当今互联网领域的一大热点,作为前端人员,我们更关注的浏览器对html5的支持性,目前Firefox、Google Chrome、Opera、Safari、Internet Explorer 等浏览器已不同程度支持 HTML5,其中要属ie支持最差,ie9以下全军覆没,根本就不认识html5标签。那么如何让旧版IE浏览器认识HTML5元素呢?

 其实,每个浏览器都有一份清单列举自己所支持的HTML元素,不在清单上的元素都将被视为未知元素,浏览器是不会给未知元素设定任何样式的。

在IE9之前的旧版IE浏览器中,未知元素的DOM显示是不正确的,IE浏览器会在DOM中插入一个没有子元素的空节点。所有你原本认为将会成为这个未知元素的子元素的元素会成为其兄弟节点。

 外国学者研究发现,在使用里如article标签之前先用js创建一个虚假的article元素,IE就会识别这个元素了,而支持用css设定样式。这个虚假元素甚至都不需要插入到DOM中,而且已经将这个插件放在google服务器上共享。

 以下是一个有效的和完整的HTML 5的样板:

<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<style type="text/css">
article, aside, dialog, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
</style>
<p>Hello World</p>

-留言评论-

  • 留言载入中...

-拍砖-

 

首页|前端技术|编程/php|生活|关于我

Copyright © 2012 wmhfly.com