HTML5技术

让老版本IE支持HTML5 - 大黑兔

字号+ 作者:H5之家 来源:H5之家 2015-09-24 11:27 我要评论( )

一直想入手C3和H5,但因为所开发的项目一直要求兼容IE7,IE8。而这两个浏览器并不支持html5,所以一直都在观望而未真正的投入太多精力去学习。尽管我知道h5和c3是主流。在最近的项目开发中,偶然的一个机会,让我了解了两个js插件。而这两个组件正好解决了我

   一直想入手C3和H5,但因为所开发的项目一直要求兼容IE7,IE8。而这两个浏览器并不支持html5,所以一直都在观望而未真正的投入太多精力去学习。尽管我知道h5和c3是主流。 在最近的项目开发中,偶然的一个机会,让我了解了两个js插件。而这两个组件正好解决了我的困扰。有句话讲得好:“万事俱备,只欠东风!”。说了这么多,接下来正式说说东风。

   html5shiv.js和respond.js。这两个JS文件让不支持H5的IE浏览器开始接受支持H5和C3。

1.html5shiv.js

        html5shiv.js让不支持html5的浏览器支持html5标签。html5的新元素不能作为父节点包裹子元素,并且不能应用CSS样式。html5shiv的使用非常的简单,考虑到IE9是支持html5的,所以直选要在页面的head中添加如下代码。

<!--[ifltIE9]>            

<script type="text/javascript" src="scripts/html5shiv.js"></script>

<![endif]-->    

如果版本小于IE9就引入html5shiv.js,IE9以前的浏览器就能使用h5标签,并使用定义好的样式了。

2.Respond.js

        Respond.js 是一个快速、轻量的 polyfill(注解1),用于为 IE6-8 以及其它不支持 CSS3 Media Queries 的浏览器提供媒体查询的 min-width 和 max-width 特性,实现响应式网页设计(Responsive Web Design)。

注解1:啥叫shim?啥是polyfill?

shim:是一个库,它将一个新的API引入到一个旧的环境中,而且仅靠旧环境中已有的手段实现
polyfill:就是一个用在浏览器API上的shim.我们通常的做法是先检查当前浏览器是否支持某个API,如果不支持的话就加载对应的polyfill.然后新旧浏览器就都可以使用这个API了.术语polyfill来自于一个家装产品Polyfilla。

使用起来也非常方便~同上!

<!--[ifltIE9]>            

<script type="text/javascript" src="scripts/respond.js"></script>

<![endif]-->    

 

3.其他

        当然,这两个只是我用到的两个js插件,解决IE8以前,以及老浏览器不支持H5的解决方案还有很多。比如PIE.js等等。

有了这些承上启下的东西,我就可以放心大胆的奔入h5的怀抱了。

        PS:博主是后端,知道的有点后知后觉。。。哈哈哈

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • HTML5 进阶系列:拖放 API 实现拖放排序 - _林鑫

    HTML5 进阶系列:拖放 API 实现拖放排序 - _林鑫

    2017-05-02 11:02

  • HTML5 进阶系列:indexedDB 数据库 - _林鑫

    HTML5 进阶系列:indexedDB 数据库 - _林鑫

    2017-04-27 14:02

  • HTML5 高级系列:web Storage - _林鑫

    HTML5 高级系列:web Storage - _林鑫

    2017-04-27 14:01

  • Omi全新版本来袭 - 指令系统 - 【当耐特】

    Omi全新版本来袭 - 指令系统 - 【当耐特】

    2017-04-20 14:04

网友点评